JavaScript Complex Info

作者： TzuHsing Su
发布时间：2019-04-06
2010 次瀏覽
暫無評論
6992字数
分類： web前端

参考自[阮一峰doc][1]

值、字符串、布尔值这三种类型，合称为原始类型（primitive type）的值

对象是最复杂的数据类型，又可以分成三个子类型
狭义的对象（object）
数组（array）
函数（function）
狭义的对象和数组是两种不同的数据组合方式

JavaScript 有三种方法，可以确定一个值到底是什么类型。
`typeof`运算符
`instanceof`运算符
`Object.prototype.toString`方法

利用这一点，typeof可以用来检查一个没有声明的变量，而不报错。

对于null和undefined，大致可以像下面这样理解。

null表示空值，即该处的值现在为空。调用函数时，某个参数未设置任何值，这时就可以传入null，表示该参数为空。比如，某个函数接受引擎抛出的错误作为参数，如果运行过程中未出错，那么这个参数就会传入null，表示未发生错误。

undefined表示“未定义”，下面是返回undefined的典型场景。

// 变量声明了，但没有赋值
    var i;
    i // undefined
    
    // 调用函数时，应该提供的参数没有提供，该参数等于 undefined
    function f(x) {
      return x;
    }
    f() // undefined
    
    // 对象没有赋值的属性
    var  o = new Object();
    o.p // undefined
    
    // 函数没有返回值时，默认返回 undefined
    function f() {}
    f() // undefined

如果 JavaScript 预期某个位置应该是布尔值，会将该位置上现有的值自动转为布尔值。转换规则是除了下面六个值被转为false，其他值都视为true。
    undefined
    null
    false
    0
    NaN
    ""或''（空字符串）
即字符串会默认转化为false而   空数组（[]）和空对象（{}）对应的布尔值，都是true。

JavaScript 内部，所有数字都是以64位浮点数形式储存，即使整数也是如此。所以，1与1.0是相同的，是同一个数。
    1 === 1.0 // true
这就是说，JavaScript 语言的底层根本没有整数，所有数字都是小数（64位浮点数）。容易造成混淆的是，某些运算只有整数才能完成，此时 JavaScript 会自动把64位浮点数，转成32位整数，然后再进行运算

0.1 + 0.2 === 0.3
    // false

0.3 / 0.1
    // 2.9999999999999996
    
    (0.3 - 0.2) === (0.2 - 0.1)
    // false

大于2的53次方的数值，都无法保持精度。由于2的53次方是一个16位的十进制数值，所以简单的法则就是，JavaScript 对15位的十进制数都可以精确处理。

如果一个数大于等于2的1024次方，那么就会发生“正向溢出”，即 JavaScript 无法表示这么大的数，这时就会返`Infinity`。
如果一个数小于等于2的-1075次方（指数部分最小值-1023，再加上小数部分的52位），那么就会发生为“负向溢出”，即 JavaScript 无法表示这么小的数，这时会直接返回0。

Math.pow(2, -1075) // 0

JavaScript 提供Number对象的MAX_VALUE和MIN_VALUE属性，返回可以表示的具体的最大值和最小值。

Number.MAX_VALUE // 1.7976931348623157e+308
    Number.MIN_VALUE // 5e-324

正零和负零
前面说过，JavaScript 的64位浮点数之中，有一个二进制位是符号位。这意味着，任何一个数都有一个对应的负值，就连0也不例外。
几乎所有场合，正零和负零都会被当作正常的0。
唯一有区别的场合是，+0或-0当作分母，返回的值是不相等的。
    (1 / +0) === (1 / -0) // false
`NaN`是 JavaScript 的特殊值，表示“非数字”（Not a Number），主要出现在将字符串解析成数字出错的场合。
0除以0也会得到`NaN`。
    NaN === NaN // false
`NaN`与任何数（包括它自己）的运算，得到的都是`NaN`。
`Infinity`表示“无穷”，用来表示两种场景。一种是一个正的数值太大，或一个负的数值太小，无法表示；另一种是非0数值除以0，得到`Infinity`。
    // 场景一
    Math.pow(2, 1024)
    // Infinity
    
    // 场景二
    0 / 0 // NaN
    1 / 0 // Infinity
Infinity 有正负之分  Infinity!=-Infinity //true
Infinity 与 NaN比较总是返回false
(Infinity-Infinity)+1  //NaN
使用parseInt()如果字符串头部有空格，空格会被自动去除。
    parseInt('   81') // 81
parseInt()可以清除数字字符串的空格但会把字符串转化为整形,当parseInt()传入第二个参数，则把第一个参数转化为第二个参数的进制数
parseFloat方法用于将一个字符串转为浮点数。
    parseFloat('314e-2') // 3.14
    parseFloat('3.14') // 3.14
`isNaN()`方法可以用来判断一个值是否为`NaN`。传入字符串的时候，字符串会被先转成NaN，所以最后返回true
    isNaN(NaN) // true
    isNaN('Hello') // true
    // 相当于
    isNaN(Number('Hello')) // true
isFinite方法返回一个布尔值，表示某个值是否为正常的数值 
    isFinite(-1); //true

字符串默认只能写在一行内，分成多行将会报错
如果长字符串必须分成多行，可以在每一行的尾部使用反斜杠。'`\`'
ES6给出的声称可以正确识别4字节字符的方法String.codePointAt，获取的码点与Unicode官方是一致的。(for...of等也是一致的)

JavaScript 原生提供两个 Base64 相关的方法。

`btoa()`：任意值转为 Base64 编码
`atob()`：Base64 编码转为原来的值

var string = 'Hello World!';
    btoa(string) // "SGVsbG8gV29ybGQh"
    atob('SGVsbG8gV29ybGQh') // "Hello World!"
    atob('Hello World!') //这两个方法不适合非 ASCII 码的字符，会报错

对象（object）是 JavaScript 语言的核心概念，也是最重要的数据类型。

什么是对象？简单说，对象就是一组“键值对”（key-value）的集合，是一种无序的复合数据集合。
对象的所有键名都是字符串（ES6 又引入了 Symbol 值也可以作为键名），所以加不加引号都可以。
如果键名不符合标识名的条件（比如第一个字符为数字，或者含有空格或运算符），且也不是数字，则必须加上引号，否则会报错。
如果键名是数值，会被自动转为字符串。

对象的每一个键名又称为“属性”（property），它的“键值”可以是任何数据类型。如果一个属性的值为函数，通常把这个属性称为“方法”，它可以像函数那样调用。

var obj = {
      p: function (x) {
        return 2 * x;
      }
    };
    
    obj.p(1) // 2
上面代码中，对象obj的属性p，就指向一个函数。

如果属性的值还是一个对象，就形成了链式引用。
    var o1 = {};
    var o2 = { bar: 'hello' };
    
    o1.foo = o2;
    o1.foo.bar // "hello"
等价于：
    var o2 = { bar: 'hello'}
    var o1 = { foo: o2}
    o1.foo.bar
对象的属性之间用逗号分隔，最后一个属性后面可以加逗号

属性可以动态创建，不必在对象声明时就指定。
    var obj = {};
    obj.foo = 'nitamashishabi';
    obj.foo // 'nitamashishabi'  suprise mother fucker，thank you for ur whatch，but ijust make some joy，the article is so boring than i need to caonima

如果不同的变量名指向同一个对象，那么它们都是这个对象的引用，也就是说指向同一个内存地址。修改其中一个变量，会影响到其他所有变量。

var o1 = {};
    var o2 = o1;
    
    o1.a = 1;
    o2.a // 1
    
    o2.b = 2;
    o1.b // 2

如果遇到这种情况，无法确定是对象还是代码块，一律解释为代码块。
    { console.log(123) } // 123
如果要解释为对象，最好在大括号前加上圆括号。因为圆括号的里面，只能是表达式，所以确保大括号只能解释为对象。
    ({ foo: 123 }) // 正确
    ({ console.log(123) }) // 报错

读取对象的属性，有两种方法，一种是使用点运算符，还有一种是使用方括号运算符。
    var obj = {
      p: 'Hello World'
    };
    
    obj.p // "Hello World"
    obj['p'] // "Hello World"

方括号运算符内部还可以使用表达式。
    var obj = {
    	'hello world' : 'caonima',
    };
    obj['hello'+' world'];
    //输出"caonima"

var obj = {
    	6 : 'caonima',
    };
    obj[3+3];
    //输出"caonima"
    obj.6  //报错
注意，数值键名不能使用点运算符（因为会被当成小数点），只能使用方括号运算符。

JavaScript 允许属性的“后绑定”，也就是说，你可以在任意时刻新增属性，没必要在定义对象的时候，就定义好属性
即：
    var obj = { p: 1 };
    
    // 等价于
    
    var obj = {};
    obj.p = 1;

查看一个对象本身的所有属性，可以使用Object.keys方法
    var obj = {
      key1: 1,
      key2: 2
    };

Object.keys(obj);
    // ['key1', 'key2']

`delete`命令用于删除对象的属性，删除成功后返回true。
    var obj = { p: 1 };
    delete obj.p // true
    obj.p // undefined
    Object.keys(obj) // []
注意，删除一个不存在的属性，delete不报错，而且返回true。
    var obj = {};
    delete obj.p // true
in运算符用于检查对象是否包含某个属性（注意，检查的是键名，不是键值），如果包含就返回true，否则返回false。它的左边是一个字符串，表示属性名，右边是一个对象。
    var obj = { p: 1 };
    'p' in obj // true
    'toString' in obj // true

in运算符的一个问题是，它不能识别哪些属性是对象自身的，哪些属性是继承的。就像上面代码中，对象obj本身并没有toString属性，但是in运算符会返回true，因为这个属性是继承的。

这时，可以使用对象的hasOwnProperty方法判断一下，是否为对象自身的属性。
    var obj = {};
    if ('toString' in obj) {
      console.log(obj.hasOwnProperty('toString')) // false
    }

for...in循环用来遍历一个对象的全部属性。

var obj = {a: 1, b: 2, c: 3};
    
    for (var i in obj) {
      console.log('键名：', i);
      console.log('键值：', obj[i]);
    }
    // 键名： a
    // 键值： 1
    // 键名： b
    // 键值： 2
    // 键名： c
    // 键值： 3

对象都继承了toString属性，但是for...in循环不会遍历到这个属性。

如果继承的属性是可遍历的，那么就会被for...in循环遍历到。但是，一般情况下，都是只想遍历对象自身的属性，所以使用for...in的时候，应该结合使用hasOwnProperty方法，在循环内部判断一下，某个属性是否为对象自身的属性
    var person = { name: '老张' };
    
    for (var key in person) {
      if (person.hasOwnProperty(key)) {
        console.log(person[key]);
      }
    }

with语句的格式如下：
    with (对象) {
      语句;
    }
它的作用是操作同一个对象的多个属性时，提供一些书写的方便。
    // 例一
    var obj = {
      p1: 1,
      p2: 2,
    };
    with (obj) {
      p1 = 4;
      p2 = 5;
    }
    // 等同于
    obj.p1 = 4;
    obj.p2 = 5;
    
    // 例二
    with (document.links[0]){
      console.log(href);
      console.log(title);
      console.log(style);
    }
    // 等同于
    console.log(document.links[0].href);
    console.log(document.links[0].title);
    console.log(document.links[0].style);

[1]: https://wangdoc.com/

最后修改：2023-04-01

如果覺得我的文章對你有用，請隨意讚賞

發表評論取消回复
使用cookie技术保留您的个人信息以便您下次快速评论，继续评论表示您已同意该条款

評論 *

私密評論

名稱 *

🎲

郵箱 *

地址

JavaScript Complex Info

TzuHsing Su • 2019 年 04 月 06 日

参考自[阮一峰doc][1]

值、字符串、布尔值这三种类型，合称为原始类型（primitive type）的值

对象是最复杂的数据类型，又可以分成三个子类型
狭义的对象（object）
数组（array）
函数（function）
狭义的对象和数组是两种不同的数据组合方式

JavaScript 有三种方法，可以确定一个值到底是什么类型。
`typeof`运算符
`instanceof`运算符
`Object.prototype.toString`方法

利用这一点，typeof可以用来检查一个没有声明的变量，而不报错。

对于null和undefined，大致可以像下面这样理解。

undefined表示“未定义”，下面是返回undefined的典型场景。

0.1 + 0.2 === 0.3
    // false

0.3 / 0.1
    // 2.9999999999999996
    
    (0.3 - 0.2) === (0.2 - 0.1)
    // false

大于2的53次方的数值，都无法保持精度。由于2的53次方是一个16位的十进制数值，所以简单的法则就是，JavaScript 对15位的十进制数都可以精确处理。

Math.pow(2, -1075) // 0

JavaScript 提供Number对象的MAX_VALUE和MIN_VALUE属性，返回可以表示的具体的最大值和最小值。

Number.MAX_VALUE // 1.7976931348623157e+308
    Number.MIN_VALUE // 5e-324

JavaScript 原生提供两个 Base64 相关的方法。

`btoa()`：任意值转为 Base64 编码
`atob()`：Base64 编码转为原来的值

var string = 'Hello World!';
    btoa(string) // "SGVsbG8gV29ybGQh"
    atob('SGVsbG8gV29ybGQh') // "Hello World!"
    atob('Hello World!') //这两个方法不适合非 ASCII 码的字符，会报错

对象（object）是 JavaScript 语言的核心概念，也是最重要的数据类型。

var obj = {
      p: function (x) {
        return 2 * x;
      }
    };
    
    obj.p(1) // 2
上面代码中，对象obj的属性p，就指向一个函数。

如果不同的变量名指向同一个对象，那么它们都是这个对象的引用，也就是说指向同一个内存地址。修改其中一个变量，会影响到其他所有变量。

var o1 = {};
    var o2 = o1;
    
    o1.a = 1;
    o2.a // 1
    
    o2.b = 2;
    o1.b // 2

方括号运算符内部还可以使用表达式。
    var obj = {
    	'hello world' : 'caonima',
    };
    obj['hello'+' world'];
    //输出"caonima"

查看一个对象本身的所有属性，可以使用Object.keys方法
    var obj = {
      key1: 1,
      key2: 2
    };

Object.keys(obj);
    // ['key1', 'key2']

for...in循环用来遍历一个对象的全部属性。

对象都继承了toString属性，但是for...in循环不会遍历到这个属性。

[1]: https://wangdoc.com/

JavaScript Complex Info

發表評論取消回复
使用cookie技术保留您的个人信息以便您下次快速评论，继续评论表示您已同意该条款

当一名我这样的博主是怎样的体验

mac13.9 ventura vmvare fusion闪退解决方案

[建站方向]从购入vps到搭建wordpress或typecho

Vue组件-render函数与props传值

欢迎使用 Typecho

草稿-使用swiper构建小程序可上下左右切换的单页面应用

[生活]你理想的美好生活有这两样东西吗？

[建站方向]从购入vps到搭建wordpress或typecho

Taro(mpvue/uniapp)引入Arms阿里前端监控

纯js实现购物车添加抛物线掉落特效

JavaScript Complex Info

發表評論 取消回复 使用cookie技术保留您的个人信息以便您下次快速评论，继续评论表示您已同意该条款

JavaScript Complex Info

發表評論取消回复
使用cookie技术保留您的个人信息以便您下次快速评论，继续评论表示您已同意该条款