GXing007的博客

1.set基本用法：ES6提供了新的数据结构set。它类似于数组，但是成员的值都是唯一的,没有重复的值。Set本身是一个构造函数，用来生成Set数据结构。const s=new Set();[2,3,5,4,5,2,2].forEach(x=>s.add(x));for(let i of s){ console.log(i);}上面代码通过add方法向Set结构加入成员，结...

解构不仅可以用于数组，还可以用于对象let { foo, bar } = { foo: "aaa", bar: "bbb" };foo // "aaa"bar // "bbb"对象的解构与数组有一个重要的不同，数组的元素是按次数排序的，变量的取值由它的位置而定，而对象的属性没有顺序，变量必须与属性同名，才能取到正确的值。let { bar, foo } = { foo: "aaa", bar:...

1.数组的解构赋值基本用法：                ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。 以前，为变量赋值，只能直接指定值。let a = 1;let b = 2;let c = 3;  ES6 允许写成下面这样。let [a, b, c] = [1, 2, 3];上面代码表示，可以从数组中提取值，按照对应位置，对变...

我们知道this关键字总是指向函数所在的当前对象，ES6又新增了一个类似的关键字super,指向当前的对象的原型对象。const proto = { foo: 'hello'};const obj = { foo: 'world', find() { return super.foo; }};Object.setPrototypeOf(obj, proto);...

该方法与Object.setPrototypeOf方法配套，用于读取一个对象的原型对象。Object.getPrototypeOf(obj);下面是一个例子。function Rectangle() { // ...}const rec = new Rectangle();Object.getPrototypeOf(rec) === Rectangle.prototype// tr...

Object.setPrototypeOf()Object.setPrototypeOf方法的作用与_proto_相同，用来设置一个对象的prototype对象，返回参数对象本身。它是ES6正式推荐的设置原型对象的方法。// 格式Object.setPrototypeOf(object, prototype)// 用法const o = Object.setPrototypeOf({}, ...

_proto_属性(前后各两个下划线)，用来读取或设置当前对象的prototype对象。目前所有浏览器(包括IE11)都部署了这个属性。// es6 的写法const obj = { method: function() { ... }};obj.__proto__ = someOtherObj;// es5 的写法var obj = Object.create(someOther...

前面说过，Object.getOwnPropertyDescriptor方法会返回某个对象属性的描述对象（descriptor）。ES2017 引入了Object.getOwnPropertyDescriptors方法，返回指定对象所有自身属性（非继承属性）的描述对象。const obj = { foo: 123, get bar() { return 'abc' }};Object...

ES6一共有5种方法可以遍历对象的属性：（1）for ……infor……in循环遍历对象自身的和继承的可枚举属性(不含Symbol属性)。（2）Object.keys(obj)Object.keys返回一个数组，包括对象自身的(不含继承的)所有可枚举属性(不含Symbol属性)的键名。(3)Object.getOwnpropertyNames(obj)Object. getOwnpropertyN...

WeakMap结构与Map结构类似，也是用于生成键值对的集合。// WeakMap 可以使用 set 方法添加成员const wm1 = new WeakMap();const key = {foo: 1};wm1.set(key, 2);wm1.get(key) // 2// WeakMap 也可以接受一个数组，// 作为构造函数的参数const k1 = [1, 2, 3];...

属性的可枚举性和遍历可枚举性对象的每一个属性都有一个描述对象(Descriptor)，用来控制该属性的行为。Object.getOwnPropertyDescriptor方法可以获取该属性的描述对象。let obj = { foo: 123 };Object.getOwnPropertyDescriptor(obj, 'foo')// {// value: 123,// wr...

基本用法Object.assign方法用于对象的合并，将源对象(source)的所有可枚举属性,复制到目标对象(target)。const target = { a: 1 };const source1 = { b: 2 };const source2 = { c: 3 };Object.assign(target, source1, source2);target // {a:1, ...

1.let命令基本用法：        ES6新增了let命令,用来声明变量。它的用法类似于var，但是所声明的变量，只在let所在命令行所在的代码块内有效。       {         let a = 10;          var b = 1;        }        a // ReferenceError: a is not defined.        b /...

ECMAScript 6.0已经在2015年6月发布了ECMAScript 方言还有 Jscript和ActionScript访问ruanyf.github.io/es-checker，可以看到自己浏览器对ES6的支持情况运行$ npm install -g es-checker       $ es-checker可以查看当前Node环境对ES6的支持情况Babel转码器Babel是一个广泛使用...

字符串也可以解构赋值。这是因为此时，字符串此时被转换成了一个类似数组的对象。const [a, b, c, d, e] = 'hello';a // "h"b // "e"c // "l"d // "l"e // "o"类似数组的对象都有一个length属性，因此还可以对这个属性解构赋值。let {length : len} = 'hello';len // 5...

Object.keys()ES5引入了Object.keys()方法，返回一个数组，成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键名。var obj = { foo: 'bar', baz: 42 };Object.keys(obj)// ["foo", "baz"]ES2017 引入了跟Object.keys配套的Object.values和Object.ent...

applay()方法拦截函数的调用，call和apply操作。apply()方法可以接受三个参数，分别是目标对象，目标的上下文对象(this)和目标对象的参数数组。var handler = { apply (target, ctx, args) { return Reflect.apply(...arguments); }};下面是一个例子。var target = funct...

Reflect对象与Proxy对象一样，也是ES6为了操作对象而提供的新的API。Reflect的设计目的有这样几个。(1).将Object对象的一些明显属于语言内部的方法(比如Object.definedProperty)，放到reflect对象上。现阶段，某些方法同时在Object和Reflect对象上部署，未来的新方法将只部署在Reflect对象上。也就是从Reflect对象上可以拿到语言内...

1.Promise的含义：Promise是异步编程的一种解决方案，比传统的解决方案--回调函数和事件--更合理和更强大。它由社区最早提出和实现，ES6 将其写进了语言标准，统一了用法，原生提供了Promise对象。所谓Promise,简单说就是一个容器，里面保存某个未来才会结束的事件(通常是一个异步操作的结果)。从语法上说，Promise是一个对象，从它可以获取异步操作的消息。Promise提供统...

set()方法用来拦截某个属性的赋值操作，可以接受4个参数，依次为目标对象，属性名，属性值，Proxy对象本身,最后一个参数可选。假定Person对象有一个age属性，该属性应该是一个不大于 200 的整数，那么可以使用Proxy保证age的属性值符合要求。let validator = { set: function(obj, prop, value) { if (prop === ...

1.get()get方法用于拦截某个属性的读取操作，可以接受三个参数，依次为目标对象，属性名，和proxy实例本身(即this关键字指向的那个对象)，其中最后一个关键字可选。var person = { name: "张三"};var proxy = new Proxy(person, { get: function(target, property) { if (prope...

Proxy用于修改某些操作的默认行为,等同于在语言层面做出修改，所以属于一种“元编程”，“meta programing”,即对编程语言进行编程。Proxy可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问,都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过滤和改写。Proxy这个词的原意是代理，用在这里表示由它来"代理"某些操作，可以译为"代理器"。var obj = ...

由于每一个Symbol值都是不相等的，这意味着Symbol值可以作为标识符，用于对象的属性名，就会保证不会出现同名的属性。这对于一个对象由多个模块构成的情况非常有用，能防止某一个键被不小心改写或者覆盖。let mySymbol = Symbol();// 第一种写法let a = {};a[mySymbol] = 'Hello!';// 第二种写法let a = { [mySym...

1.概述ES5 的对象属性名都是字符串，这容易造成属性名的冲突。比如，你使用了一个他人提供的对象，但又想为这个对象添加新的方法（mixin 模式），新方法的名字就有可能与现有方法产生冲突。如果有一种机制，保证每个属性的名字都是独一无二的就好了，这样就从根本上防止属性名的冲突。这就是 ES6 引入Symbol的原因。ES6又引入了一种原始数据类型Symbol，表示独一无二的值。他是JavaScrip...

《数组的扩展》一章中，已经介绍过扩展运算符(……)const [a, ...b] = [1, 2, 3];a // 1b // [2, 3]ES2018 将这个运算符引入了对象。解构赋值：            对象的解构赋值用于从一个对象取值，相当于将目标对象自身的所有可遍历的(enumberable)，但是尚未读取的属性，分配到指定的对象上面。let { x, y, ...z } = { ...

1.交换变量的值let x = 1;let y = 2;[x, y] = [y, x];2.从函数返回多个值函数只能返回一个值，如果要返回多个值，只能将他们放在数组或对象里返回。有了解构赋值，取出这些值就非常方便。// 返回一个数组function example() { return [1, 2, 3];}let [a, b, c] = example();// 返回一个对...

不能使用圆括号的情况：以下三种赋值解构不能使用圆括号：(1)变量声明语句：/ 全部报错let [(a)] = [1];let {x: (c)} = {};let ({x: c}) = {};let {(x: c)} = {};let {(x): c} = {};let { o: ({ p: p }) } = { o: { p: 2 } };以上6个语句会全部报错，因为他们都是变量声...

函数的参数也可以使用解构赋值eg：function add([x, y]){ return x + y;}add([1, 2]); // 3[[1, 2], [3, 4]].map(([a, b]) => a + b);// [ 3, 7 ]函数参数的解构也可以使用默认值function move({x = 0, y = 0} = {}) { return [x, y];}...

解构赋值时，如果等号右边是数值和布尔值，则会先转为对象。let {toString: s} = 123;s === Number.prototype.toString // truelet {toString: s} = true;s === Boolean.prototype.toString // true上面代码中，数值和布尔值的包装对象都有toString属性，因此变量s都能取到值...

Map 结构的实例有以下属性和操作方法。（1）size 属性size属性返回 Map 结构的成员总数。const map = new Map();map.set('foo', true);map.set('bar', false);map.size // 2（2）set(key, value)set方法设置键名key对应的键值为value，然后返回整个 Map 结构。如果key已经有值，则键...

含义和基本用法：JavaScript 的对象（Object），本质上是键值对的集合（Hash 结构），但是传统上只能用字符串当作键。这给它的使用带来了很大的限制。const data = {};const element = document.getElementById('myDiv');data[element] = 'metadata';data['[object HTMLDivEl...

含义：WeakSet结构与Set类似，也是不重复值得集合。但是，它与set有两个区别。首先，WeakSet的成员只能是对象而不是其他的值。const ws = new WeakSet();ws.add(1)// TypeError: Invalid value used in weak setws.add(Symbol())// TypeError: invalid value used ...

双冒号运算符箭头函数可以绑定this对象，大大减少了显示绑定this对象的写法(call,apply,bind)。但是箭头函数并不适用所有场合，所以现在有一个提案，提出了“函数绑定”（function bind）运算符，用来取代call、apply、bind调用。函数绑定运算符是并排的两个冒号（::），双冒号左边是一个对象，右边是一个函数。该运算符会自动将左边的对象，作为上下文环境（即th...

基本用法ES6允许使用“箭头”来定义函数var f = v => v;上面的箭头函数等同于：var f = function(v) { return v;};如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分。var f = () => 5;// 等同于var f = function () { return 5 };var sum = (num1, nu...

函数的name属性返回该函数的函数名function foo() {}foo.name // "foo"这个属性早就被浏览器广泛支持，但是直到 ES6，才将其写入了标准。需要注意的是，ES6 对这个属性的行为做出了一些修改。如果将一个匿名函数赋值给一个变量，ES5 的name属性，会返回空字符串，而 ES6 的name属性会返回实际的函数名。var f = function () {};//...

从 ES5 开始，函数内部可以设定为严格模式。function doSomething(a, b) { 'use strict'; // code}ES2016 做了一点修改，规定只要函数参数使用了默认值、解构赋值、或者扩展运算符，那么函数内部就不能显式设定为严格模式，否则会报错。// 报错function doSomething(a, b = a) { 'use strict';...

ES6 引入 rest 参数（形式为...变量名），用于获取函数的多余参数，这样就不需要使用arguments对象了。rest 参数搭配的变量是一个数组，该变量将多余的参数放入数组中。function add(...values) { let sum = 0; for (var val of values) { sum += val; } return sum;}...

利用参数默认值，可以指定某一个参数不得省略，如果省略就抛出一个错误。function throwIfMissing() { throw new Error('Missing parameter');}function foo(mustBeProvided = throwIfMissing()) { return mustBeProvided;}foo()// Error: M...

一旦设置了参数的默认值，函数进行声明初始化时，参数会形成一个单独的作用域（context）。等到初始化结束，这个作用域就会消失。这种语法行为，在不设置参数默认值时，是不会出现的。var x = 1;function f(x, y = x) { console.log(y);}f(2) // 2上面代码中，参数y的默认值等于变量x。调用函数f时，参数形成一个单独的作用域。在这个作用域里...

指定了默认值以后，函数的length属性，将返回没有指定默认值的参数个数。也就是说，指定了默认值后，length属性将失真。(function (a) {}).length // 1(function (a = 5) {}).length // 0(function (a, b, c = 5) {}).length // 2这是因为length属性的含义是，该函数预期传入的参数个数。某个参数指...