You Don't Konw JS学习笔记（上册）

笔记顺序与原书相同，但是提炼的知识点不尽相同

编译原理

JS是个什么样的语言

尽管通常将 JavaScript 归类为“动态”或“解释执行”语言，但事实上它是一门编译语言。

JS确实是一门编译语言（通常在执行前几微秒时间内编译）

• 与传统的编译语言不同，JS不是提前编译的，编译结果也不能在分布式系统中进行移植。
  • 传统编译语言分为
    • 分词/词法解析
    • 解析/语法解析
    • 代码生成

编译器工作方式

• 查询方式
  • LHS赋值操作的目标（对变量进行赋值）
    • 函数参数的传递时隐式变量赋值
  • RHS谁是赋值操作的源头–非左侧（获取变量的值）
  • 在变量还没有声明（在任何作用域中都无法找到该变量）的情况下，这两种查询的行为是不一样的
  • 非严格模式下，采用LHS查询，编译器会热心的给你未申明的变量创建一个

  俩个重要错误
  
  
  ReferenceError 同作用域判别失败相关，而 TypeError 则代表作用域判别成功了，但是对
  结果的操作是非法或不合理的。

• 提升
  • 先有蛋（声明）后有鸡（赋值）
  • 只有声明本身会被提升，而赋值或其他运行逻辑会留在原地。如果提升改变
    了代码执行的顺序，会造成非常严重的破坏。
  • 函数声明会被提升，但是函数表达式却不会被提升。
  • 函数声明和变量声明都会被提升。是函数会首先被提升，然后才是变量
• 我们习惯将 var a = 2; 看作一个声明，而实际上 JavaScript 引擎并不这么认为。它将 var a和 a = 2 当作两个单独的声明，第一个是编译阶段的任务，而第二个则是执行阶段的任务

作用域

• 函数作用域与全局作用域并不互通
  • 区分函数声明和表达式最简单的方法是看 function 关键字出现在声明中的位置（不仅仅是一行代码，而是整个声明中的位置）。如果 function 是声明中的第一个词，那么就是一个函数声明，否则就是一个函数表达式

var  a = 1
+function (){
    console.log(a)  // undefined
    var a = 2
}()
console.log(typeof(a), a)  //number NaN

• ES6 let, const
  • let
    for 循环头部的 let 不仅将 i 绑定到了 for 循环的块中，事实上它将其重新绑定到了循环的每一个迭代中，确保使用上一个循环迭代结束时的值重新进行赋值。
  • const
    对于简单类型的数据（数值、字符串、布尔值），值就保存在变量指向的那个内存地址，因此等同于常量。
    对于复合类型的数据（主要是对象和数组），变量指向的内存地址，const只能保证这个指针是固定的，不能保证它指向的数据结构是不可变得

闭包

尽管技术上来讲，闭包是发生在定义时的，但并不非常明显，就好像六祖慧能所说：“既非风动，亦非幡动，仁者心动耳。”

• 无论通过何种手段将内部函数传递到所在的词法作用域以外，它都会持有对原始定义作用域的引用，无论在何处执行这个函数都会使用闭包。
• 只要使用了回调函数，实际上就是在使用闭包！
• 尽管 IIFE 本身并不是观察闭包的恰当例子，但它的确创建了闭包，并且也是最常用来创建可以被封闭起来的闭包的工具。因此 IIFE 的确同闭包息息相关，即使本身并不会真的使用闭包。

this

this 提供了一种更优雅的方式来隐式“传递”一个对象引用，因此可以将 API 设计得更加简洁并且易于复用

this简介

this 是在运行时进行绑定的，并不是在编写时绑定，它的上下文取决于函数调
用时的各种条件。this 的绑定和函数声明的位置没有任何关系，只取决于函数的调用方式。
当一个函数被调用时，会创建一个活动记录（有时候也称为执行上下文）。这个记录会包
含函数在哪里被调用（调用栈）、函数的调用方法、传入的参数等信息。this 就是记录的
其中一个属性，会在函数执行的过程中用到。

this 绑定

• 默认绑定

  • this指向全局对
    • 值得注意的是如果使用严格模式，那么this会指向undefined

• 隐式绑定

  • 这个函数严格来说都不属于
    obj 对象。然而，调用位置会使用 obj 上下文来引用函数，因此你可以说函数被调用时 obj 对象“拥有”或者“包含”它。
  • 隐式丢失
    • 应用了默认绑定，把this指向了全局变量

function foo() {
console.log( this.a );
}
var obj = {
a: 2,
foo: foo
};
obj.foo(); // 2

• 显示绑定
  • call(…) 和 apply(…) 方法

function foo() {
console.log( this.a );
}
var obj = {
a:2
};
foo.call( obj ); // 2

• 硬绑定的典型应用场景就是创建一个包裹函数，传入所有的参数并返回接收到的所有值：
• 在 ES5 中提供了内置的方法 Function.prototype.bind

 function foo(something) {
   console.log( this.a, something );
   return this.a + something;
 }
 var obj = {
   a:2
 };
 var bar = foo.bind( obj );
 var b = bar( 3 ); // 2 3
 console.log( b ); // 5

• new绑定

在 JavaScript 中，构造函数只是一些使用 new 操作符时被调用的函数。它们并不会属于某个类，也不会实例化一个类。实际上，它们甚至都不能说是一种特殊的函数类型，它们只是被 new 操作符调用的普通函数而已。

使用 new 来调用函数

1. 创建（或者说构造）一个全新的对象。
2. 这个新对象会被执行 [[ 原型 ]] 连接。
3. 这个新对象会绑定到函数调用的 this。
4. 如果函数没有返回其他对象，那么 new 表达式中的函数调用会自动返回这个新对象。

• 箭头函数的this
  • 根据外层（函数或者全局）作用域来决定 this

对象

类型

类型判断是JS中非常重要的一部分-- 字节跳动面试官

七种基本类型

• string
• number
• boolean
• null
• undefined
• object
  虽然使用typeof null，会返回object,但实际上null本身是基本类型（可以通过 === 判断是不是null）

null 和 undefined 没有对应的构造形式，它们只有文字形式。相反，Date 只有构造，没有
文字形式。

内容

• .a 语法通常被称为“属性访问”，[“a”] 语法通常被称为“键访问”。
• 在对象中，属性名永远都是字符串
• ES6 增加了可计算属性名，可以在文字形式中使用 [] 包裹一个表达式来当作属性名

var prefix = "foo";
var myObject = {
[prefix + "bar"]:"hello",
[prefix + "baz"]: "world"
};
myObject["foobar"]; // hello
myObject["foobaz"]; // world

• 浅拷贝和深拷贝

原型

颠覆传统认知的一部分，不能理解