一. Symbol1.1. Symbol 的基本使用Symbol 是什么呢？Symbol 是 ES6 中新增的一个基本数据类型，翻译为符号。 那么为什么需要 Symbol 呢？ 在 ES6 之前，对象的属性名都是字符串形式，那么很容易造成属性名的冲突； 比如原来有一个对象，我们希望在其中添加一个新的属性和值，但是我们在不确定它原来内部有什么内容的情况下，很容易造成冲突，从而覆盖掉它内部的某个属性； 比如我们前面在讲 apply、call、bind 实现时，我们有给其中添加一个 fn 属性，那么如果它内部原来已经有了 fn 属性了呢？ 比如开发中我们使用混入，那么混入中出现了同名的属性，必然有一个会被覆盖掉； Symbol 就是为了解决上面的问题，用来生成一个独一无二的值。 Symbol 值是通过 Symbol 函数来生成的，生成后可以作为属性名； 也就是在 ES6 中，对象的属性名可以使用字符串，也可以使用 Symbol； 12const s = Symbol();console.log(s); // Symbol() Symbol 即使多次创建值，它们也是不同的 ...

一. let/const1.1. let/const 基本使用在 ES5 中我们声明变量都是使用的 var 关键字，从 ES6 开始新增了两个关键字可以声明变量：let、const let、const 在其他编程语言中都是有的，所以也并不是新鲜的关键字； 但是 let、const 确确实实给 JavaScript 带来一些不一样的东西； let 关键字： 从直观的角度来说，let 和 var 是没有太大的区别的，都是用于声明一个变量 1234let foo = "foo";foo = "why";var bar = "bar";bar = "why"; const 关键字： const 关键字是 constant 的单词的缩写，表示常量、衡量的意思； 它表示保存的数据一旦被赋值，就不能被修改； 12const foo = "foo";foo = "why"; // TypeError: Assignment to consta ...

一. ES6 定义类1.1. 认识 class 定义类我们会发现，按照前面的构造函数形式创建 类，不仅仅和编写普通的函数过于相似，而且代码并不容易理解。 在 ES6（ECMAScript2015）新的标准中使用了 class 关键字来直接定义类； 但是类本质上依然是前面所讲的构造函数、原型链的语法糖而已； 所以学好了前面的构造函数、原型链更有利于我们理解类的概念和继承关系； 那么，如何使用 class 来定义一个类呢？ 可以使用两种方式来声明类：类声明和类表达式； 12345// 类的声明class Person {}// 类的表达式const Student = class {}; 接着我们就可以使用 new 操作符调用类： 123const p1 = new Person();const p2 = new Person();console.log(p1, p2); 我们来研究一下类的一些特性： 你会发现它和我们的构造函数的特性其实是一致的； 123456const p = new Person();console.log ...

一. 类的继承和实现1.1. Object 是所有类的父类从我们上面的 Object 原型我们可以得出一个结论：原型链是最顶层的原型对象就是 Object 的原型对象 12345678910function Person(name, age) { this.name = name; this.age = age;}Person.prototype.running = function () { console.log(this.name + "running~");};const p1 = new Person("why", 18); 所以我们会发现，放到 Object 原型上的所有方法我们都可以继承过来： 12console.log(p1.valueOf());console.log(p1.toString()); 1.2. 通过原型链实现继承如果我们现在需要实现继承，那么就可以利用原型链来实现了： 目前 stu 的原型是 p 对象，而 p 对象的原型是 Person 默认的原型，里面包含 ...

一. 认识原型1.1. 认识对象的原型JavaScript 当中每个对象都有一个特殊的内置属性 [[prototype]]，这个特殊的对象可以指向另外一个对象。 那么这个对象有什么用呢？ 当我们通过引用对象的属性 key 来获取一个 value 时，它会触发 [[Get]]的操作； 这个操作会首先检查该属性是否有对应的属性，如果有的话就使用它； 如果对象中没有改属性，那么会访问对象[[prototype]]内置属性指向的对象上的属性； 这个 [[prototype]] 我们通常会将其称之为隐式原型； 那么如果通过字面量直接创建一个对象，这个对象也会有这样的属性吗？如果有，应该如何获取这个属性呢？ 答案是有的，只要是对象都会有这样的一个内置属性； 获取的方式有两种： 方式一：通过对象的 __proto__ 属性可以获取到（但是这个是早期浏览器自己添加的，存在一定的兼容性问题）； 方式二：通过 Object.getPrototypeOf 方法可以获取到； 123456const obj = {};// 方式一: __proto__(有浏览器兼容问 ...

一. 认识 JavaScript 对象1.1. 对象的定义方式对象是 JavaScript 中一个非常重要的概念，这是因为对象可以将多个相关联的数据封装到一起，更好的描述一个事物： 比如我们可以描述一辆车：Car，具有颜色（color）、速度（speed）、品牌（brand）、价格（price），行驶（travel）等等； 比如我们可以描述一个人：Person，具有姓名（name）、年龄（age）、身高（height），吃东西（eat）、跑步（run）等等； 用对象来描述事物，更有利于我们将现实的事物，抽离成代码中某个数据结构： 所以有一些编程语言就是纯面向对象的编程语言，比 Java； 你在实现任何现实抽象时都需要先创建一个类，根据类再去创建对象； JavaScript 其实支持多种编程范式的，包括函数式编程和面向对象编程： JavaScript 中的对象被设计成一组属性的无序集合，像是一个哈希表，有 key 和 value 组成； key 是一个标识符，value 可以是任意类型，包括也可以是其他对象或者函数类型； 如果值是一个函数，那么我们可以称之为是对象 ...

一. with 和 eval1.1. with 语句with 语句 扩展一个语句的作用域链。 不建议使用with语句，因为它可能是混淆错误和兼容性问题的根源。 12345const obj = { name: "hello world", age: 18 };with (obj) { console.log(name); console.log(age);} 1.2. eval 函数eval 是一个特殊的函数，它可以将传入的字符串当做 JavaScript 代码来运行。 1234// const name = "why";// console.log(name);const evalString = `var name = "why";console.log(name)`;eval(evalString); 不建议在开发中使用 eval： eval 代码的可读性非常的差（代码的可读性是高质量代码的重要原则）； eval 是一个字符串，那么有可能在执行的过程中被刻意篡改，那 ...

一. JavaScript 纯函数1.1. 理解纯函数函数式编程中有一个非常重要的概念叫纯函数，JavaScript 符合函数式编程的范式，所以也有纯函数的概念； 在 react 开发中纯函数是被多次提及的； 比如 react 中组件就被要求像是一个纯函数（为什么是像，因为还有 class 组件），redux 中有一个 reducer 的概念，也是要求必须是一个纯函数； 所以掌握纯函数对于理解很多框架的设计是非常有帮助的； 纯函数的维基百科定义： 在程序设计中，若一个函数符合一下条件，那么这个函数被称为纯函数： 此函数在相同的输入值时，需产生相同的输出。 函数的输出和输入值以外的其他隐藏信息或状态无关，也和由 I/O 设备产生的外部输出无关。 该函数不能有语义上可观察的函数副作用，诸如“触发事件”，使输出设备输出，或更改输出值以外物件的内容等。 当然上面的定义会过于的晦涩，所以我简单总结一下： 确定的输入，一定会产生确定的输出； 函数在执行过程中，不能产生副作用； 那么这里又有一个概念，叫做副作用，什么又是副作用呢？ 副作用（side effec ...

一. 理解 this1.1. 为什么使用 this在常见的编程语言中，几乎都有 this 这个关键字（Objective-C 中使用的是 self），但是 JavaScript 中的 this 和常见的面向对象语言中的 this 不太一样： 常见面向对象的编程语言中，比如 Java、C++、Swift、Dart 等等一系列语言中，this 通常只会出现在类的方法中。 也就是你需要有一个类，类中的方法（特别是实例方法）中，this 代表的是当前调用对象。 但是 JavaScript 中的 this 更加灵活，无论是它出现的位置还是它代表的含义。 使用 this 有什么意义呢？下面的代码中，我们通过对象字面量创建出来一个对象，当我们调用对象的方法时，希望将对象的名称一起进行打印。 如果没有 this，那么我们的代码会是下面的写法： 在方法中，为了能够获取到 name 名称，必须通过 obj 的引用（变量名称）来获取。 但是这样做有一个很大的弊端：如果我将 obj 的名称换成了 info，那么所有的方法中的 obj 都需要换成 info。 123456789101112co ...