《JavaScript秘密花园》— 笔记-CSDN博客

前言

本文是笔者阅读了《JavaScript秘密花园》之后的一些总结，主要是一些平常容易忽略的小知识点。

数字的字面值如何当做对象使用

2.toString(); // 出错：SyntaxError, JS解析器将数字与点操作符视为一体

// 解决办法
2..toString(); // 以小数形式表示
2 .toString(); // 中间留空
(2).toString(); // 利用圆括号的优先级复制代码

使用[]与点操作符设置或者获取属性有什么区别

const keyA = {a: 1}
const keyB = {b: 2}
const obj = {    
    [keyA]: 'aaa',    
    [keyB]: 'bbb'
}

console.log(obj); // {[object Object]: "bbb"}

/* 因为使用中括号去获取或者设置属性时, 中括号里的key可以是变量,  
 * 但是在对象中, 属性名永远是字符串, 如果使用string以外的值作为变量, 
 * JS引擎会使用object的tostring方法进行转换成string（隐式转换）. 
 * 所以这里的情况是 keyA, keyB被转换成了 [object Object] 的形式.
 */
复制代码

一个解绑定包装器

foo.prototype.method = function(a, b, c) {    
    console.log(this, a, b, c);
};

foo.method = function() {    
    // 结果: Foo.prototype.method.call(this, arg1, arg2... argN)    
    Function.call.apply(foo.prototype.method, arguments);
};
foo.method = function() {    
    var args = Array.prototype.slice.call(arguments);    
    foo.prototype.method.apply(args[0], args.slice(1));
};

foo.method = function() {    
    var args = Array.prototype.slice.call(arguments);    
    foo.prototype.method.bind(args[0], ...args.slice(1))();
}

f.method(1,2,3,4) // Number {1} 2 3 4
// 这三个方法效力是一样的
复制代码

我们想让foo.method跟foo.prototype.method完成一样的功能，但是想显式地指定方法体中的this对象（第一个参数是this） —— 解绑定

arguments在strict mode下的不同

function f(a) {    
    "use strict";    
    a = 42;    
    return [a, arguments[0]];
}

var pair = f(17);
console.log(pair[0] === 42); // true
console.log(pair[1] === 17); // true

// 严格模式下，参数的值不会随 arguments 对象的值的改变而变化。
// 并且在严格模式下, 对callee进行读写都会抛出一个错误

function f(a) {    
    //"use strict";    
    a = 42;    
    return [a, arguments[0]];
}

var pair = f(17);
console.log(pair[0] === 42); // true
console.log(pair[1] === 17); // false

// 非严格模式下, 对arguments的改动会影响到参数复制代码

精确的得到数据类型

function toString( value ) {    
    return Object.prototype.toString.call(value).slice(8, -1)
}

// 可以得到 Symbol String Array Object Function Number Null Undefined 复制代码

快速转换字符串（数字）

'' + 10 === '10'; // true
+'10' === 10; // true复制代码

单线程导致的阻塞调用

function foo(){    
    // 只存在一个等待运行的函数    
    setTimeout(foo, 100);
}

foo();复制代码