桃花扇的博客

受到函数式编程的影响，在ES5中提出了一个重要的理念：减少魔法、让代码更加纯粹。ES6贯彻了这种理念，认为属性内存的控制、原型链的修改、函数的调用等等，都属于底层实现，属于一种魔法，因此，需要将他们提取出来，形成一个正常的API，并高度聚合到某个对象中，由此形成了Reflect对象，它提供了一系列方法，可以让开发者通过调用这些方法，访问一些JS底层功能。所以，其实Reflect对象中有很多的API都可以使用过去的某种语法或其他API到达相同的效果，比如：属性的赋值与取值、调用普通函数、调用构造函数、判断属性

上篇讲到可以用属性描述符来对属性做一些描述，以及用来描述属性的四个属性(value，configurable，enumerable，writable)。这篇讲的存取器属性就是在属性描述符中配置get()和set()方法，配置这两个方法之后，该属性就不是一个普通属性了。存取器属性最大的意义，在于可以控制属性的读取和赋值。如果一个属性是存取器属性，则读取该属性时，会运行get方法，将get方法得到的返回值作为属性值，如果给该属性赋值，则会运行set方法。举个栗子来理解一下叭~【例1】const o

我们知道，对象中包括各种属性，而属性描述符(Property Descriptor)就是用来描述这些属性的，它本质上还是一个普通对象，通过以下四个方面来对属性进行描述1）value：属性值2）configurable：该属性的描述符是否可以修改，即属性描述符这个对象里的内容能否被修改3）enumerable：该属性是否可以被枚举4）writable：该属性是否可以被重新赋值我们可以通过Object.getOwnPropertyDescriptor(对象，属性名) 得到一个对象的某个属性的

在ES5中，我们使用的是对象的方式来存储键值对，键是属性名，值是属性值，这种方法有以下问题1）键名只能是字符串2）获取数据的数量不方便3）键名容易跟原型上的名称冲突ES6中新增了map集合专门用于存储多个键值对数据。键值对（key value pair）数据集合的特点：键不可重复。1.创建map1）new Map() —— 创建一个空的map2）new Map(iterable) —— 创建一个具有初始内容的map，初始内容来自于可迭代对象每一次迭代的结果，但是，它要求每一次..

一直以来，JS只能使用数组和对象来保存多个数据，缺乏像其他语言那样拥有丰富的集合类型。因此ES6新增了两种集合类型（map和set），用在不同的场景中发挥作用。其中，set用于存放不重复的数据目录1.set集合的创建2.对set集合进行后续的操作3.与数组进行交换4.遍历1.set集合的创建【例1】//方法1：创建一个没有任何内容的set集合const s1 = new Set();console.log(s1);//方法2：创建一个具有初始内容的set集合，内容..

1.生成器的概念1）定义：生成器是一个通过构造函数Generator创建的对象，生成器既是一个迭代器，同时又是一个迭代对象。2）生成器的创建：我们并不能new一个生成器，而是由生成器函数（Generator Function）来创建生成器3）生成器的书写：function* method() {}，该函数返回一个生成器，即调用生成器函数后，得到一个生成器。【例1】function* test() {}const generator = test();【结果】2..

上篇说到迭代可以按照一定的规则，从指定的空间中取出数据。区别于循环的是，迭代过程不知道数据的长度，也不知道要取多少个数据。迭代器（iterator）是一个具有next方法的对象，next方法返回下一个数据并且能指示是否迭代完成；迭代器创建函数是一个返回迭代器的函数。这一篇来讲一下可迭代协议和for-of循环。1.可迭代协议ES6规定，如果一个对象具有知名符号属性Symbol.iterator，并且属性值是一个迭代器创建函数，则该对象是可迭代的（iterable）【注】判断一个对象是否可迭代，就是

1.背景知识1）迭代的定义：从一个数据集合中按照一定的顺序，不断取出数据的过程称为迭代2）迭代和遍历的区别迭代：迭代强调的是依次取数据的过程，并不保证取多少，也不保证把所有的数据都取完遍历：遍历强调的是要把整个数据依次全部取出3）迭代器：对迭代过程的封装，在不同的语言中有不同的表现形式，通常为对象4）迭代模式：一种设计模式，用于统一迭代过程，迭代模式规范了迭代器规格迭代器应该具有得到下一个数据的能力 迭代器应该具有判断是否还有后续数据的能力2.JS中的迭代器JS规定，如果

1.文件上传流程1）客户端将文件数据发送给服务器2）服务器保存上传的文件数据到服务器端3）服务器响应给客户端一个文件访问地址2.与服务器端的约定1）键的名称（表单域名称）：imagefile2）请求方法：POST３）请求的表单格式：multiparty/form-data4）请求体中必须包含一个键值对，键的名称是服务器要求的名称，值是文件数据【注】HTML5中，JS仍然无法随意获取文件数据，但是可以获取到input元素中，被用户选中的文件数据【注】可以利用HTML5提

之前搞定了Promise，接下来来学习Fetch API。封装过AJAX函数的各位肯定能知道XMLHttpRequest的问题（没有封装过的点这里），首先其所有的功能全部集中在同一对象上，容易书写混乱不易维护代码；其次，我们都到ES6啦，传统的事件驱动模式，无法适配新的Promise API，因此1.Fetch API概述并非取代AJAX，而是对AJAX传统的API的改进 精细的功能分割：头部信息，请求信息，响应信息等均分布到不同的对象，更利于处理各种复杂的AJAX场景 使用Promise AP

在此之前的两篇文章已经把Promise的用法交代清楚了，Promise确实很好的解决了回调地狱等异步处理出现的问题，提高了代码的阅读性，但是在代码形式上较为复杂，还有很多回调的感觉，不易于阅读和理解。因此ES6还新增了async和await两个关键字，作为简化Promise API的方法，注意，只是简化，而并不是代替Promise1.async1）用法async用于修饰函数（无论是函数字面量还是函数表达式），放置在函数声明前位置，被修饰函数的返回结果一定是Promise对象，其目的在于简化函数的

上一篇介绍了Promise的一些基本用法和串联，这一篇具体讲一下它的API，包括上篇使用的then和catch，以及扩充的静态成员finally和几个静态成员。除此之外，我们可以看到，Promise在解决异步问题的同时，也存在一定的问题，比如返回值，回调等，总之还是不方便阅读和理解，因此ES6新增了async和await来改善这一问题，使得我们异步处理的代码看起来并没有回调的感觉，就像正常代码一样，是ES6提供的语法糖，非常好用。一.Promise的相关API1.实例成员1）then：注册一个后

1.基本使用首先清楚promise的过程：事件从unsettled未解决阶段（pending状态）开始发展到settled已解决阶段（resolved和rejected状态），Promise对象可以传resolve与reject两个函数，其中resolve函数将Promise推向resolved阶段，reject函数将Promise推向rejected阶段，且两者均只可传一个参数，表示推向状态的数据，下面给个图理解一下注册thenable函数：当Promise是resolved状态时，执行th.

上一篇中提到了回调地狱的问题，ES6为了解决多层回调，提高代码的可阅读性，提出了一套异步的通用模型，这一部分对理解promise很重要1.两个阶段该模型中，将一件可能发生异步操作的事情分为两个阶段：unsettled 和 settledunsettled：未解决阶段，表示事情还在进行前期的处理，并没有发生通向结果的那件事 settled：已解决阶段，事情已经有了一个结果，不管这个结果是什么，整件事情无法逆转【注】事情总是从为解决阶段逐步发展到以解决阶段的，并且未解决阶段拥有控制何时通向已解决

封装完写了个回调地狱，真是吐了，写不动了，分享一下代码吧//封装ajax函数function ajax(obj) { //指定提交方式的默认值 obj.type = obj.type || 'get'; //设置是否为异步，默认值为异步 obj.async = obj.async || true; //设置数据的默认值 obj.data = obj.data || null; //根据不同的浏览器创建XHR对象 let xhr = nu

目录1.共享符号2.知名符号1.共享符号上节课讲到每次调用得到的符号都是不相同的，但是存在需要同一个符号的需求，因此ES6提供了静态方法for，可以根据某个符号名称（符号描述）得到同一个符号，如下例【例1-1】const syb1 = Symbol.for('这是一个共享符号');const syb2 = Symbol.for('这是一个共享符号');console....

在编程时，我们会遇到某些属性，我们不需要或者不想要别人访问它，即需要设置私有属性，而在ES6之前，并没有方法实现属性私有化，因此ES6提供了新的数据类型，为我们提供设置私有属性的方法1.普通符号1）创建通过Symbol函数创建，如下const syb = Symbol('这是一个符号');console.log(syb);2）特点I.没有字面量II.使用typeof...

解构：使用ES6的一种语法规则，将一个对象或数组的某个属性提取到某个变量中称为解构，并且解构不会对被解构的目标造成任何影响首先给出一个对象用作解构const user = { name: 'jwh', age: 23, address: { city: '西安', school: '西安邮电大学' }}在ES6之前，如...

１.继承的概念如果两个类A和B，如果可以描述为：B是A（例如：猫是动物，轿车是汽车，男人是人），则A和B形成继承关系。如果B是A，则：B继承自A A派生B B是A的子类 A是B的父类如果A是B的父类，则B会自动拥有A中的所有实例成员【例1】ES6之前的继承function Animal(type, name, age, sex) { this.type = typ...

目录一.面向对象简介二.类(构造函数的语法糖)1.传统的构造函数的问题2.类的特点三.类的其他书写方式1.可计算的成员名2.getter和setter3.静态成员4.字段初始化器5.类表达式一.面向对象简介面向对象是一种思想，和具体的语言一样，与面向过程对比如下： 面向过程：思考的切入点是功能的步骤 面向对象：思考的切入点是对象的划...

一.新增的对象字面量语法二.Object新增API

1.新增API——new.target众所周知，js中构造函数需使用new来调用，但是即使不使用new关键字，也可以调用构造函数，如【例1-1】，为了解决这一问题，js的解决方式为使用instanceof查看原型上是否有该构造函数，如【例1-2】，到了es6提供了一个特殊的API，可以使用该API在函数内部，判断该函数是否使用new来调用，如【例1-3】【例1-1】构造函数的两种调用方式...

上一篇讲了剩余参数和展开运算符，这一篇来几个小练习巩固一下吧首先明确一点，展开运算符实现的克隆是浅克隆，即若克隆引用值，实际克隆的是它的地址，举个栗子叭【例1】const obj = { name: 'jwh', age: '18', sex: 'female', hobby: ['read', 'sing', 'sport']};const ob...

1.默认参数（1）使用在书写型参数，直接给形参进行赋值的值成为默认值，如此，在调用函数时，如果没有给对应的参数赋值（即它的值为undefined），则会自动使用默认值（2）对arguments的影响只要给函数加上参数默认值，该函数会自动变成严格模式下的规则，即arguments和形参脱离（3）暂时性死区的问题形参和ES6中的 let / const 声明一样，具有作用域，并...

目录1.Unicode支持2.新增字符串API3.正则中的粘连标记4.模板字符串1.Unicode支持早期由于存储资源有限，Unicode使用16位二进制来存储文字，我们将一个16位二进制编码叫做一个码元（code unit）。后来由于技术的发展，Unicode对文字编码进行了扩展，将某些文字扩展到了32位（占用了两个码元）【例1-1】，并且将某个文字对应的二进制数字...

var声明变量的问题let与const声明变量规则以及二者的区别

1.ECMAScript、JavaScript、NodeJs的区别（1）ECMAScript：简称ES，是一个语言标准（循环、变量、判断、数组等数据类型）（2）JavaScript：运行在浏览器端的语言，该语言使用ES标准。ES + web api = JavaScript（3）NodeJs：运行在服务器端的语言，该语言使用ES标准。ES + node api = NodeJs...