interviewnew_原型链_作用域链_预处理_预解析

Posted 2020-12-17 mailyuan

1. New操作符具体干了什么

对于const a = new Foo();，new 干了以下事情

• const o = new Object();    //创建了一个新的空对象o
  o.__proto__ = Foo.prototype;    //让这个o对象的` __proto__`指向函数的原型`prototype` 让空对象的原型属性指向原型链，设置原型链 obj._proto_=Func.prototype;
  Foo.call(o);    // 让构造函数的this指向o
  a = o;    // 将 o 对象赋给a对象 返回添加属性后的对象

  用 call 来实现继承，用 this 可以继承 Foo 中的所有方法和属性

•  

  function Func1(){
      this.name = ‘Lee‘;
      this.myTxt = function(txt) {
          console.log( ‘i am‘,txt );
      }
  }
   
  function Func2(){
      Func1.call(this);    // 执行 Func1，并且 Func1() 中的 this 指向 Func2
  }
   
  var func = new Func2();

  func.myTxt(‘Geing‘); // i am Geing console.log (Func3.name); // Lee

  

 

2. 深入Js之我是如何搞懂作用域和闭包的（参考：https://juejin.im/post/5e8d28c0518825739c734dfb#heading-0）

作用域：

就是存放 变量 和 函数 的地方

• ES6之前，js 只有 全局作用域 和 函数作用域

全局作用域中存放了全局变量和全局函数。

每个函数也有自己的作用域，函数作用域中存放了函数中定义的变量

由于变量提升带来的变量会在不被察觉的情况下被覆盖掉、for 循环中本该被销毁的变量没有被销毁等一系列问题

• ES6 新增的 let 和 const ，实现了块级作用域

作用域链：

 

多个上下级关系的作用域形成的链, 它的方向是从小向大的(从内到外)

 

作用：查找变量的规则

 

先自身作用域找，找不到再上一级找，最终来到全局作用域，找不到就报错(xxx is not defined)

 

闭包：

MDN 中对闭包的定义："函数和对其周围状态（词法环境）的引用捆绑在一起构成闭包。"

在 javascript 中，根据词法作用域的规则，内部函数总是可以访问其外函数中声明的变量，当通过调用外部函数返回一个内部函数后，即使该外部函数已经执行结束了，但是内部函数引用外部函数的变量依然保存在内存中，我们就把这些变量的集合称为闭包

比如下面外部函数 foo那么这些变量的集合就称为 foo 函数的闭包 

• 

  function foo() {
      var name = ‘Top‘
      let test1 = 1
      const test2 = 2
      var innerBar = {
          getName: function() {
              console.log(test1)
              return name
          },
          setName: function(newName) {
              name = newName
          }
      }
      return innerBar
  }
  
  var bar = foo()
  bar.setName(‘You‘)
  bar.getName()
  console.log(bar.getName)

  

 

3. 在 js 中，查找对象属性的 原型链

Javascript 是面向对象的，每个实例对象都有一个__proto_属性，该属性指向它原型对象，这个实例对象的构造函数有一个原型属性 prototype，与实例的__proto__属性指向同一个对象。当一个对象在查找一个属性的时，自身没有就会根据__proto__ 向它的原型进行查找，如果都没有，则向它的原型的原型继续查找，直到查到Object.prototype._proto_为 null，这样也就形成了原型链。

 

4. 预解析、预处理做了什么事？

• 全局代码：
• js 引擎在将要执行全局代码之前，创建一个全局执行上下文对象 window
• 将 var 关键字声明的变量，添加为 window 属性，值为 undefined
• 将 function 关键字声明的函数，添加 window 方法，值为函数体
• 确定全局 this 指向，指向为 window
• 函数代码：
• js 引擎在将要执行函数代码之前，创建一个函数执行上下文对象（没办法直接操作）
• 将 var 关键字声明的变量，添加为函数执行上下文对象属性，值为undefined
• 将 function 关键字声明的函数，添加函数执行上下文对象方法，值为函数体
• 将形参赋值为实参，添加为函数执行上下文对象的属性
• 将传入的实参添加到 arguments 中, 添加为函数执行上下文对象的属性
• 确定 this 的指向, 添加为函数执行上下文对象的属性