前端面试题讲解(THIS、构造函数、面向对象、堆栈内存以及闭包)

视频地址：https://www.bilibili.com/video/av24383268/?p=13

• 02. JS中的严格模式和ARG映射机制
  • EXP1
  • EXP2
    • 映射机制
    • 严格模式
• 03. 逻辑或和逻辑与
  • EXP1
    • 逻辑或和逻辑与
    • 逻辑与和逻辑或的混合应用模式
• 04. 有关堆栈内存释放
• 05. 练习题讲解
  • EXP1
  • EXP2
• 06. 堆栈内存和this混合应用
  • EXP1
  • EXP2
• 07. 构造函数和原型链的运行机制
  • EXP1
    • 基本数据类型和引用数据类型
    • 函数类型
    • 对象类型
    • prototype
  • EXP2
• 08. 基于闭包解决循环绑定
  • EXP1
    • 事件绑定为什么会导致出错
    • 解决方案
    • 闭包解决
• 09. 关于this的两道题
  • EXP1
    • this指向判断
  • EXP2
• 10. 关于原型重定向问题
  • EXP1
    • 原型重定向导致的问题
• 11. 关于原型重定向综合性练习
  • EXP1
• 12. 数组去重引发的基于内置类原型拓展方法，并且实现链式调用
  • EXP1:
• 13. 闭包和团队协作开发
  • EXP1
  • EXP2
  • EXP3

02. JS中的严格模式和ARG映射机制

EXP1

if(!("a" in window)){
    // !true
    var a = 1;
}
console.log(a);

输出：undefined

不管条件是否成立都要进行变量提升，在全局作用域下声明的变量，也相当于给window设置了一个对象的属性，而且两者之间建立了映射机制 <=> window.a = undefined

in：检测某一个属性是否隶属于这个对象，不管是私有属性还是公有属性，只要有这个属性结果就是true

hasOwnProperty：检测某一个属性是否为对象的私有属性（只有这个属性是私有的才可以）

EXP2

var a = 4;
function b(x, y, a){
   
    console.log(a);
    arguments[2] = 10;
    console.log(a);
}
a = b(1,2,3); // a = undefined
console.log(a)

输出：3 10 undefined

arguments：函数内置的实参集合，不管是否设置形参，传递的实参值都在这个集合中，结构如下：

arguments: {
   
    0: 1,
    1: 2,
    2: 3,
    length: 3,
    callee: // 函数本身
}

在非严格模式下，函数中的形参变量存在映射机制（相互之间存在影响），改变形参arguments的值会改变，改变arguments形参中对应的参数会改变

映射机制

function fn(x, y){
   
    var arg = arguments;
    arg[0] = 2;
    console.log(x); // => 2
    y = 1;
    console.log(arg[1]) // => undefined
}

fn(10)

ARG和形参之间的映射是以ARG的索引为基础完成的，ARG中有这个索引，浏览器会完成和对应形参变量中的映射机制搭建，如果形参比ARG中的个数多，那么多出来的形成那是无法和ARG中的索引建立关联的。

arguments的映射机制，是依赖于索引而进行的

function fn(x, y){
   
    var arg = arguments;
    arg[0] = 2;
    console.log(x); // => 2
    arg[1] = 1;
    console.log(y) // => undefined
    y = 400;
    console.log(arg[1]);
}

fn(10)

arguments和形参的映射机制是建立在函数执行后形参赋值的一瞬，此时能建立映射机制的建立映射机制，不能建立起来的，以后不管怎么操作都无法建立了

严格模式

在当前作用域的第一行添加 "use strict" 即可，这样在当前作用域中就开启了严格模式

1. 在严格模式下不支持使用 arguments.callee / arguments.callee.caller
2. 在严格模式下 arguments 和形参没有映射机制
3. 不允许一个对象下有两个相同的属性名（非严格模式下，后设置的属性会覆盖前一个属性）
4. 在严格模式下，函数执行，如果没有明确指定执行的主体（函数前面没有.），不再像严格模式下，统一交给 window，而是让 this 指向 undefined

03. 逻辑或和逻辑与

EXP1

var foo = 'hello';
(function(foo){
   
    /*
        形参赋值：foo = 'hello'
        变量提升：var foo; 这一步省略：因为在私有作用于中已经有foo这个变量了，浏览器不会重新声明重复的变量
    */
    console.log(foo);
    var foo = foo || 'world';
    console.log(foo) // => 'hello'
})(foo); // 把全局下的foo的值作为实参传递给函数的形参 => "hello"
console.log(foo); // => 'undefined'

结果： ‘hello’ ‘undefined’

逻辑或和逻辑与

1. 或赋值

   var a