资讯专栏INFORMATION COLUMN

JavaScript之类型

gecko23 / 3251人阅读

摘要:内置类型中有其中内置类型空值未定义布尔值数字字符串对象符号新增在中可以用运算符来查看值的类型,他返回的是类型的字符串值。

内置类型

JavaScript中有其中内置类型

空值(null)

未定义(undefined)

布尔值(boolean)

数字(number)

字符串(string)

对象(object)

符号(symbol, ES6新增)
在javascript中可以用typeof运算符来查看值的类型,他返回的是类型的字符串值。

</>复制代码

  1. typeof null === "object"; //true
  2. typeof undefined === "undefined"; //true
  3. typeof true === "boolean"; //true
  4. typeof 42 === "number"; //true
  5. typeof "42" === "string"; //true
  6. typeof {life: 42} === "object"; //true
  7. typeof Symbol() === "symbol"; //true

以上除了null类型之外,其他的六种类型均有同名的字符串值与之对应,并且null是基本类型中唯一的一个假值类型,typeof对他的返回值是object
除了上述的内置类型,还有一种情况

</>复制代码

  1. typeof function a(){} === "function"; //true

如此看来,function(函数)也是javascript中的一个内置类型,但是通过instanceof这个属性可以发现,实际上它是object的一个子类型,具体来说,可以把函数当作可调用对象,他是一个内部属性[[call]], 该属性使其可以被调用,既然是对象,那函数也有自己的属性,函数对象的length属性是其声明的参数的个数

</>复制代码

  1. function a(b, c){}
  2. a.length; //2
值和引用

在javascript中,变量可能包含两种不同数据类型的值,基本类型值和引用类型值。
基本类型值指的是简单的数据段: 总是通过值复制的方式来赋值/传递,包括null,undefined,字符串,数字,布尔和ES6中的symbol
引用类型值指那些可能有多个值构成的对象(包括数组和封装对象和函数),则总是通过引用复制的方式来赋值/传递
值复制:从一个变量像另一个变量复制基本类型的值,会在变量对象上创建一个新值,然后将该值复制到为新变量分配的位置上,此后这两个变量可以参与任何操作不会有相互影响。

</>复制代码

  1. var a = 2;
  2. var b = a; //b是a的值的一个副本
  3. b++
  4. a; //2
  5. b; //3

引用复制: 从一个变量像另一个变量复制引用类型的值时,同样将会存储在变量对象中的值复制一份放到新分配的空间里中。不同的是,这个值的复本实际上是一个指针,而这个指针指向存储在堆中的一个对象。,两个变量实际上将引用同一个对象,其中改变其中一个变量,就会改变另一个变量

</>复制代码

  1. var c = [1,2,3];
  2. var d = c;
  3. d.push(4);
  4. c; //[1,2,3,4]
  5. d; //[1,2,3,4]

而且由于引用指向的是值本身而非变量,所以一个引用无法更改另一个引用的指向

</>复制代码

  1. var a = [1,2,3]
  2. var b = a;
  3. a; //[1,2,3]
  4. b; //[1,2,3]
  5. b = [4,5,6] //b指向值[4,5,6]
  6. a; //[1,2,3]
  7. b; //[4,5,6]

b = [4,5,6]并不影响a指向值[1,2,3],除非b不是指向数组的引用,而是指向函数a的指针,但在javascript中不存在这样的情况
函数传参: 在javascript中所有函数的参数都是按值传递的,也就是说,把函数外部的值复制给函数内部的参数。即在向参数传递基本类型的值时,被传递的值会被复制给一个局部变量,在向参数传递引用类型的值时,会将这个值在内存中的地址复制给一个局部变量。

</>复制代码

  1. function foo(x){
  2. x.push(4);
  3. x; //[1,2,3,4];
  4. x = [4,5,6];
  5. x.push(7);
  6. x; //[4,5,6,7]
  7. }
  8. var a = [1,2,3];
  9. foo(a);
  10. a; // 是[1,2,3,4]而不是[4,5,6,7];

我们在向函数传参的时候,实际上是把引用a的复本赋值给x了,而a仍指向[1,2,3]。

字符串

字符串和数组很相似,都有length属性以及indexOf()和concat()方法,在javascript中字符串是不可变的,字符串的成员函数不会改变其原始值,而是创建并返回一个新的字符串。

</>复制代码

  1. var a = foo;
  2. var b = a.toUpperCase();
  3. a === b //false
  4. a; //"foo";
  5. b; //"FOO"

许多数组函数用来处理字符串很方便,虽然字符串没有这些函数,但可以通过借用数组的非变更方法来处理字符串;

</>复制代码

  1. var a = foo;
  2. a.join; //undefined
  3. a.map; //undefined
  4. var b = Array.prototype.join.call(a, "-");
  5. var c = Array.prototype.map.call(a, function(v){
  6. return v.toUpperCase() + ".";
  7. }).join("");
  8. b; //"f-o-o"
  9. c; //"F.O.O"

例如常见的字符串反转问题

</>复制代码

  1. var a = "foo";
  2. var b = Array.prototype.reverse.call(a);
  3. b; //"oof";
  4. //也可以是
  5. var c = a.split("").resverse().join("");
  6. c; //"oof"

上述方法对于包含复杂字符(Unicode, 星号, 多字节字符等)的字符串不适用,需要特殊的库来实现

数字

javascript只有一种数值类型: number(数字), 包括整数和带小数的十进制数,javascript中没有真正意义上的整数,javascript中的整数就是没有小数的十进制数,所以42.0等同于整数42。 而数字类型常见的问题就是

</>复制代码

  1. 0.1 + 0.2 === 0.3 //false

这是因为二进制浮点数中的0.1和0.2并不是十分精确,他们相加的结果并非刚好等于0.3,而是一个比较接近的数字,所以判断结果为false。
对于这种情况,最常见的方法是设置一个误差范围值,从ES6开始,该值定义在Number.EPSILON中我们可以直接拿来用。

</>复制代码

  1. if(!Number.EPSILON){
  2. Number.EPSILON = Math.pow(2, -52);
  3. }
  4. function foo(n1, n2){
  5. return Math.abs(n1 - n2) < Number.EPSILON
  6. }
  7. var a = 0.1 + 0.2
  8. var b = 0.3
  9. foo(a, b); //true
特殊的数字

1.不是数字的数字
如果数学运算的操作数不是数字类型(或者无法解析常规的十进制或十六进制数字),就无法返回一个有效的数字,这种情况下返回值为NaN。例如

</>复制代码

  1. var a = 2 / "foo"; //NaN
  2. typeof a === "number"; // true

NaN是一个警戒值,用于指出数字类型中的错误情况,即执行数学运算没有成功,这是失败后返回的结果。他是一个特殊值,她和自身不相等

</>复制代码

  1. var a = 2 / "foo"
  2. a === NaN; //false

我们可以用内建的全局工具函数isNaN(..)来判断一个值是否是NaN,但是这种方法有严重缺陷

</>复制代码

  1. var a = 2 / "foo";
  2. var b = foo;
  3. window.isNaN(a); //true;
  4. window.isNaN(b); //true;

对于这种现象,ES6开始使用工具函数Number.isNaN(..)

</>复制代码

  1. if(!Number.isNaN){
  2. Number.isNaN = function(n){
  3. return n !== n;
  4. }
  5. }
  6. var a = 2 / "foo";
  7. var b = foo;
  8. Number.isNaN(a); //true
  9. Number.isNaN(b); //false

2.无穷数
在javascript中1 / 0 和 - 1 / 0这种操作会返回Infinity或者-Infinity
javascript使用有限数字表示法,所以javascript的运算结果容易溢出,此时结果为Infinity或者-Infinity
3.零值
javascript中有一个常规的0,还有一个-0

</>复制代码

  1. var a = 0 / -3; // -0
  2. var b = 0 * -3; // -0

-0进行字符串化会返回0

</>复制代码

  1. var a = 0 / -3;
  2. a.toString(); //"0";
  3. a + ""; //"0"

将其从字符串转换成数字,得到的结果是正确的

</>复制代码

  1. + "-0"; //"0"
  2. Number("-0"); //"0"
布尔

javascript中有两个关键词true和false,代表真和假,其他数据类型的值可以强制转换为布尔值。在javascript中假值有这些:
undefined,null,false,+0, -0和NaN,""。除了这些值之外其他是真值。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/84810.html

相关文章

  • JavaScript 闯关记

    摘要:对象数组初始化表达式,闯关记之上文档对象模型是针对和文档的一个。闯关记之数组数组是值的有序集合。数组是动态的,根闯关记之语法的语法大量借鉴了及其他类语言如和的语法。 《JavaScript 闯关记》之 DOM(下) Element 类型 除了 Document 类型之外,Element 类型就要算是 Web 编程中最常用的类型了。Element 类型用于表现 XML 或 HTML 元素...

    mj 评论0 收藏0
  • JavaScript专题系列文章

    摘要:专题系列共计篇,主要研究日常开发中一些功能点的实现,比如防抖节流去重类型判断拷贝最值扁平柯里递归乱序排序等,特点是研究专题之函数组合专题系列第十六篇,讲解函数组合,并且使用柯里化和函数组合实现模式需求我们需要写一个函数,输入,返回。 JavaScript 专题之从零实现 jQuery 的 extend JavaScritp 专题系列第七篇,讲解如何从零实现一个 jQuery 的 ext...

    Maxiye 评论0 收藏0
  • JS专题数组去重

    摘要:将元素作为对象的键,默认键对应的值为如果对象中没有这个键,则将这个元素放入结果数组中去。 前言 数组去重在日常开发中的使用频率还是较高的,也是网上随便一抓一大把的话题,所以,我写这篇文章目的在于归纳和总结,既然很多人都在提的数组去重,自己到底了解多少呢。又或者是如果自己在开发中遇到了去重的需求,自己能想到更好的解决方案吗。 这次我们来理一理怎么做数组去重才能做得最合适,既要考虑兼容性,...

    only_do 评论0 收藏0
  • 【进阶1-3期】JavaScript深入内存空间详细图解

    摘要:进阶期理解中的执行上下文和执行栈进阶期深入之执行上下文栈和变量对象但是今天补充一个知识点某些情况下,调用堆栈中函数调用的数量超出了调用堆栈的实际大小,浏览器会抛出一个错误终止运行。 (关注福利,关注本公众号回复[资料]领取优质前端视频,包括Vue、React、Node源码和实战、面试指导) 本周正式开始前端进阶的第一期,本周的主题是调用堆栈,今天是第3天。 本计划一共28期,每期重点攻...

    coordinate35 评论0 收藏0
  • javascript关键字,保留字, 变量及数据类型

    摘要:之关键字保留字变量及数据类型个人总结,分享也供自己日后查询变量中变量通过关键字来声明的。在使用声明变量但未对其加以初始化时,这个变量的值就是,例如在控制台输出是也就是未定义类型布尔类型该类型只有两个字面值和。 javascript之关键字,保留字, 变量及数据类型 个人总结,分享也供自己日后查询 1.变量 javascript 中变量通过var关键字(variable)来声明的。 变量...

    stormgens 评论0 收藏0
  • WebSocket系列JavaScript中数字数据如何转换为二进制数据

    摘要:以和为例,说明中的数字数据如何转换为二进制数据。对象用来表示通用的固定长度的原始二进制数据缓冲区。中的数字数据如何转换为二进制数据对和有了一个大概的了解,下面让我们来看下它是如何进行二进制数据操作的。 概述 本文主要通过对JavaScript中数字数据与二进制数据之间的转换,让读者能够了解在JavaScript中如何对数字类型(包括但不限于Number类型)进行处理。 二进制数据在日常...

    MASAILA 评论0 收藏0

发表评论

0条评论

gecko23

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<