博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
闲话JavaScript数据类型
阅读量:6708 次
发布时间:2019-06-25

本文共 3939 字,大约阅读时间需要 13 分钟。

JavaScript支持的类型

JS的内置数据类型罗列如下:

undefinednullboolnumberstringfunctionobject    Function        Date        Error        自定义function    new Function    new Date    new Error    new 自定义functionsymbol

bool, number, string

bool, number, string这三种类型的赋值是同类似的。

字面量方式赋值

var b = true;var n = 10;var s = 'hello';

函数式赋值

与字面量方式等价的函数式赋值

var b = Boolean(true);var n = Number(10);var s = String('hello');

可验证变量的类型:

typeof b; // 'bool'typeof n; // 'number'typeof s; // 'string'

基本类型包装类

倘若透过基本类型包装类构造,那么这些变量都变成object类型了。

var obj_b = new Boolean(true);var obj_n = new Number(10);var obj_s = new String('hello');typeof obj_b; // 'object'typeof obj_n; // 'object'typeof obj_s; // 'object'

基本类型包装类实例(obj_b, obj_n, obj_s)可认为是基本类型字面量(b, n, s),由值类型被封装成了一个引用类型,二者之间可以做比较的。

obj_b.valueOf() == b  //trueobj_n.valueOf() == n  //trueobj_s.valueOf() == s  //true

看来基本类型包装类(Number, Boolean, String)即能当函数直接调用,也能做构造方法,这正是JS函数的魔法。这里自定义一个函数MyNumber, 模仿Number的实现。

function MyNumber(value) {    var _self = this;    // 如果是new构造出来的    if (_self instanceof MyNumber) {        _self.value = value;        return _self;    }    return parseFloat(value);}MyNumber.prototype.valueOf = function() {    return parseFloat(this.value);}MyNumber.prototype.doubledValue = function() {    return this.valueOf() * 2;}var mnum = MyNumber('12abc');console.log(mnum);       // 12console.log(typeof mnum);// numbervar obj_mnum = new MyNumber('12abc');console.log(obj_mnum);  // { [Number: 12] value: '12abc' }console.log(+obj_mnum); // 12. +用来转化为number类型,所以返回.valueOf()的结果console.log(typeof obj_mnum);        // objectconsole.log(obj_mnum.doubledValue()) //24

若不用new,也可用Object.create(..prototype),二者等价。

var obj_mnum = Object.create(MyNumber.prototype);MyNumber.call(obj_mnum, '12abc')console.log(obj_mnum);  // { [Number: 12] value: '12abc' }console.log(+obj_mnum); // 12. +用来转化为number类型,所以返回.valueOf()的结果console.log(typeof obj_mnum);        // objectconsole.log(obj_mnum.doubledValue()) //24

基本类型字面量和基本类型包装类实例的关系

二者之间可以做算数运算:

obj_n + n //20// 过程: obj_n是引用类型 //       ->通过调用其valueOf()转为值类型10 //       -> 10 + 10 = 20obj_b + obj_n // 11// 过程:obj_b引用类型//      -> 调用valueOf()转为值类型true//      -> 布尔true需要转为number类型做算数运算,调用Number(true),得到1//      obj_n引用类型 -> 转为值类型 10//      所以 1 + 10 = 11

关于JS数据类型转换详情,请看

基本类型何以能调用方法

严格来讲,基本类型字面量是不能调用任何方法的。但是'hello'.length会成功返回5. 这因为JS解释器在执行这句代码时,会生成一个临时的基本类型包装类的实例,并调用其length。执行完后,就销毁了这个临时变量。

var tmp = new String('hello');tmp.length

undefined 和 null

变量声明而不赋值,其值就是undefined

var a;a === undefined; //true. a 严格等于 undefinedtypeof a;        // 'undefined'

若赋值为null:

var a = null;a === null;      // truea === undefined; // false, a 不再严格等于undefinedtypeof a;        // 'object'

可理解为,null是有值的,特殊的空值;而undfined是表示无值。

undefined 和 null的一些区别

1.. JSON.stringify会序列化null值,但不会序列化undefined

var obj = {name: 'tom', age: null}    JSON.stringify(obj) // '{"name":"tom","age":null}'        var obj = {name: 'tom', age: undefined} //'{"name":"tom"}'
对象实例的字段声明为undefined,是无意义的。

2.. undefined会触发ES6的default value,而null不会。

function greet(name='world') {        console.log('hello', name)    }    greet()          //hello world    greet(undefined) //hello world    greet(null)      //hello null

这里也进一步印证了, null本身是有值的,不过是个特殊的空值。而undefined是无值的。

值得一提的是,基本类型undefined/null是没有任何方法的,也不能够调用其任何方法。这根bool/number/string不同,这因为是undefined/null没有包装类

symbol

ES6新增的基本类型,只支持函数式赋值,不支持字面量和函数构造。

var sim = Symbol('IBM') // oksim                     // Symbol('IBM')typeof sim              // 'symbol'sim = new Symbol('IBM') // TypeError: Symbol is not a constructor

function 和 Function

JS函数可以通过new Function构造,但通常用function关键字定义。二者的关联,已在有详细的阐述。这里就简要说明下,函数本身和函数构造实例的一点区别。

type of Date // function. Date本身是函数typeof new Date() // object. 通过new Date构造出来的是object实例new Date().__proto__ == Date.prototype //true. // new Date()既然是由Date函数构造出来的,// 所以new Date()的run-time  __proto__就是Date的design-time的prototype// new Date()就是Date的构造实例了new Date() instanceof Date // true.

关于 run-time __proto__和design-time prototype,请读者参考

转载地址:http://xkslo.baihongyu.com/

你可能感兴趣的文章
JavaScript 数组去重并统计重复元素出现的次数
查看>>
ZJOI2002昂贵的聘礼题解
查看>>
【msdn wpf forum翻译】获取当前窗口焦点所在的元素
查看>>
1tb等于多少g 1TB和500G有什么区别
查看>>
收购/代理游戏或其它成熟的在线应用
查看>>
让人难以置信的HTML5和JavaScript实验
查看>>
远程访问linux的利器 NXFree
查看>>
C++11 正则表达式——基础知识介绍
查看>>
潜移默化学会WPF(样式)-- DataGrid(转载)
查看>>
C|C++中的静态全局变量,静态局部变量,全局变量,局部变量的区别
查看>>
mongo-mapreduce测试(6)——综合测试
查看>>
利用top构造Sql Server分页查询
查看>>
java 整体知识架构
查看>>
PHP验证码
查看>>
对象序列化与反序列化(二进制 byte[])
查看>>
在同一张表存在多条记录,只修改最近的一条
查看>>
Hudson可扩展持续集成引擎
查看>>
显示系统托盘列表(并执行隐藏与显示)
查看>>
codeforces Gargari and Permutations(DAG+BFS)
查看>>
定长内存池之BOOST::pool
查看>>