JavaScript学习笔记：你必须要懂的原生JS（二）

11、如何正确地判断this？箭头函数的this是什么？

this是 JavaScript 语言的一个关键字。它是函数运行时，在函数体内部自动生成的一个对象，只能在函数体内部使用。

this的绑定规则有四种：默认绑定，隐式绑定，显式绑定，new绑定

函数是否在new中调用（new绑定），如果是，那么this绑定的是新创建的对象；
函数是否通过call，apply调用，或者使用了bind（即硬绑定），如果是，那么this绑定的就是指定的对象；
函数是否在某个上下文对象中调用（隐式绑定），如果是的话，this绑定的是那个上下文对象。一般是obj.foo()；
如果以上都不是，那么使用默认绑定。如果在严格模式下，则绑定到undefined，否则绑定到全局对象；
如果把null或者undefined作为this的绑定对象传入call、apply或者bind，这些值在调用时会被忽略，实际应用的是默认绑定规则；
箭头函数没有自己的this，它的this继承于上一层代码块的this。

12、语法作用域和this的区别

语法作用域是由你在写代码时将变量和块作用域写在哪里来决定的；
this是在调用时被绑定的，this指向什么，完全取决于函数的调用位置

13、谈谈你对JS执行上下文和作用域链的理解

执行上下文就是当前JavaScript代码被解析和执行时所在环境，JS在执行上下文栈可以认为是一个存储函数调用的栈结构，遵循先进后出的原则。

JavaScript执行在单线程上，所有代码都是排队执行
一开始浏览器执行全局的代码时，首先创建全局的执行上下文，压入执行栈的顶部
每当进入一个函数的执行就会创建函数的执行上下文，并且把它压入执行栈的顶部。当前函数执行完成后，当前函数的执行上下文出栈，并等待垃圾回收。
浏览器的JS执行引擎总是访问栈顶的执行上下文
全局上下文只有唯一的一个，它在浏览器关闭时出栈

14、什么是闭包？闭包的作用是什么？闭包有哪些使用场景？

闭包是指有权访问另一位函数作用域的变量的函数，创建闭包最常用的方式就是在一个函数内部创建另一个函数。

闭包的作用有：

封装私有变量；
模仿块级作用域；
实现JS的模块。

15、call、apply有什么区别？call，apply和bind的内部是如何实现的？

call和apply的功能相同，区别在于传参的方式不一样：

fn.call(obj,arg1,arg2,...)，调用一个函数，具有一个指定的this值和分别地提供的参数（参数的列表）
fn.apply(obj,[argsArray])，调用一个函数，具有一个指定的this值，以及作为一个数组（或类数组对象）提供的参数

call核心：

将函数设为传入参数的属性；
指定this到函数并传入给定参数执行函数；
如果不传入参数或者参数为null，默认指向为window/global；
删除参数上的函数

apply：

apply的实现和call很类似，但是需要注意他们的参数是不一样的，apply的第二个参数是数组或类数组。

bind：

bind和call/apply有一个很重要的区别，一个函数被call/apply的时候，会直接调用，但是bind会创建一个新函数。当这个新函数被调用时，bind()的第一个参数将作为它运行时的this，之后的一序列参数将会在传递的实参前传入作为它的参数。

16、new的原理是什么？通过new的方式创建对象和通过字面量创建有什么区别？

new：

创建一个新对象；
这个新对象会被执行[[原型]]连接；
将构造函数的作用域赋值给新对象，即this指向这个新对象；
如果函数函数没有返回其他对象，那么new表达式中的函数调用会自动返回这个新对象。

字面量创建对象，不会调用Object构造函数，简洁且性能更好。

new Object（）方式创建对象本质上是方法调用，涉及到在proto链中遍历该方法，当找到该方法后，又会生产方法调用必须的堆栈信息，方法调用结束后，还要释放该堆栈，性能不如字面量的方式。

17、谈谈你对原型的理解

在JavaScript中，每当定义一个对象（函数也是对象）的时候，对象中都会包含一些预定义的属性。其中每个函数对象都有一个prototype属性，这个属性指向函数的原型对象。使用原型对象的好处是所有实例共享它所包含的属性和方法。

18、什么是原型链？

原型链解决的主要是继承问题。

每个对象拥有一个原型对象，通过proto指针指向其原型对象，并从中继承方法和属性，同时原型对象也可能拥有原型，这样一层一层，最终指向null。这种关系被称为原型链，通过原型链一个对可以拥有定义在其他对象中的属性和方法。

19、prototype和_proto_区别是什么？

prototype是构造函数的属性。

_proto_是每个实例都有的属性，可以访问[[prototype]]属性。

实例的_proto_与其构造函数的prototype指向的是同一个对象。

20、使用ES5实现一个继承

function SuperType() {
    this.name = name;
    this.colors = ['red', 'blue', 'green'];
}
SuperType.prototype.sayName = function() {
    console.log(this.name);
}

function SubType(name, age) {
SuperType.call(this, name);
this.age = age;
}
SubType.prototype = new SuperType();
SubType.prototype.constructor = SubType;

SubType.prototype.sayAge = function() {
console.log(this.age);
}