JavaScript中的坑

内容：关于JavaScript中的一些蛋疼的问题以及面试笔试中常见的一些坑爹套路总结

此部分内容持续总结完善中、、、

1.undefined和null的区别

• null： Null类型，代表空值，代表一个空对象指针，使用typeof运算得到object，所以可以认为它是一个特殊的对象值
• undefined： Undefined类型，当一个声明了一个变量未初始化时，得到的就是undefined，但是typeof一个未声明的变量得到的也是undefined

  null和undefined的不同之处:

• null是javascript的关键字，可以认为是对象类型，它是一个空对象指针，和其它语言一样都是代表空值
• undefined是javascript独有的，是一个预定义的全局变量，没有返回值的函数返回为undefined，没有实参的形参也是undefined
• undefined是访问一个未初始化的变量时返回的值而null是访问一个尚未存在的对象时返回的值。因此可把undefined看作是空的变量而null看作是空的对象
• 在定义一个想保存对象的变量时，就可以让该变量先保存null值，这样既能体现null是一个空指针对象，也能更好的区分null和undefined
• 在声明一个变量时应该尽量去赋值，这样确保typeof一个变量名为undefined的情况下这个变量是未声明的

2.坑爹的this

JavaScript中的this，是包含它的函数作为方法被调用时所属的对象

var o = {
    foo: 1,
    bar: function(){
        return this.foo
    }
}

o.bar()
// 1

var a = o.bar
a()
// undefined

以上代码两种输出结果是由this的动态作用域导致的，第一次输出时里面的this是对象o，第二次输出时里面的this是对象window(全局对象)

当然可以使用bind方法绑定作用域：

var o = {
    foo: 1,
    bar: function(){
        return this.foo
    }
}

o.bar()
// 1

var a = o.bar
a()
// undefined

var b = o.bar.bind(o)
b()
// 1
o.foo = 12
b()
// 12

3.bind apply call

(1)介绍

在JavaScript中，call、apply和bind是Function对象自带的三个方法，这三个方法的主要作用是改变函数中的this指向

bind apply call方法的共同点和区别：

• bind apply call三者都是用来改变函数的this对象的指向的
• bind apply call三者第一个参数都是this要指向的对象，也就是想指定的上下文
• bind apply call三者都可以利用后续参数传参
• bind 是返回对应函数，便于稍后调用；apply 、call 则是立即调用 

(2)bind

bind方法会创建一个新函数，称为绑定函数，当调用这个绑定函数时，绑定函数会以创建它时传入 bind方法的第一个参数作为 this，传入 bind方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数

注意：bind方法的返回值是函数

// bind()最简单的用法是创建一个函数，使这个函数不论怎么调用都有同样的this值
// 常见的错误: 将方法从对象中拿出来赋值给变量然后调用，并希望this指向原来的对象 但是实际上此时this指向全局对象window
// 这样如果不做特殊处理，一般会丢失原来的对象
// 但是使用bind()方法能够很漂亮的解决这个问题：

this.num = 9; 
var module = {
  num: 81,
  getNum: function() { return this.num; }
};
 
module.getNum(); // 81
 
var getNum = module.getNum;
getNum(); // 9, 因为在这个例子中，"this"指向全局对象
 
// 创建一个'this'绑定到module的函数
var boundGetNum = getNum.bind(module);
boundGetNum(); // 81

(3)apply和call

apply方法：

语法：apply([thisObj[,argArray]])

定义：应用某一对象的一个方法，用另一个对象替换当前对象，注意apply方法第二个参数必须是数组或arguments对象

call方法：

语法：call([thisObj[,arg1[, arg2[, [,.argN]]]]])

定义：调用一个对象的一个方法，以另一个对象替换当前对象。

说明： call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象

call 和 apply的区别：
对于 apply、call 二者而言，作用完全一样，只是接受参数的方式不太一样。call 需要把参数按顺序传递进去，而 apply 则是把参数放在数组里。

既然两者功能一样，那该用哪个呢？在JavaScript 中，某个函数的参数数量是不固定的，因此要说适用条件的话，当你的参数是明确知道数量时用 call ；而不确定的时候用 apply，然后把参数 push 进数组传递进去。当参数数量不确定时，函数内部也可以通过 arguments 这个数组来遍历所有的参数

call和apply使用实例：

// apply 做了两件事情
// 1是绑定 this
// 2 是把数组参数解开传给函数
// console.log.apply(console, arguments)
// 调用 log 函数, this 是 cosnole
// arguments 是一个数组, 但是作为参数 传递给 log 函数

// call 和 apply 一模一样几乎
// 区别只在于传递参数的方式
console.log.apply(console, [1, 2, 3, 4])
console.log.call(console, 1, 2, 3, 4)