ES6特性

    xiaoxiao2021-04-18  271

    合并对象或数据

    方法一: let o1 = { a: 1, b: 2, c: 3 }; let o2 = {...o1, d: 4}; // o2 = { a: 1, b: 2, c: 3, d: 4 } let arr1 = [0, 1, 2]; let arr2 = [...arr1, 3]; // arr2 = [0, 1, 2, 3] 方法二: let o1 = { a: 1, b: 2, c: 3 }; let o2 = Objcet.assign({}, o1, { d: 4 }); // o2 = { a: 1, b: 2, c: 3, d: 4 };

    Map

    //是一个数据结构,区分数组的map遍历方法 // Object结构是“字符串——值”,而Map数据结构是“值(各种类型的值,包括对象)——值”,是一种更完善的Hash结构实现 const m = new Map(); const o = {p: 'Hello World'}; m.set(o, 'content') m.get(o) // "content" m.has(o) // true m.delete(o) // true m.has(o) // false

    创建类

    class A { // 初始化 constructor(name) { this.name = name; } // 自定义方法 func1() { ... } } let a1 = new A('my name');

    解构

    let o1 = {a: 1, b: 2, c: 3}; const {a, b} = o1; // a = 1, b = 2

    唯一键值

    let id = Symbols('id'); // 生成一个唯一键位 let a = {}; a[id] = '唯一表示';

    异步操作

    let sleep = (time) => { return new Promise((resolve, reject) => { setTimeout(() => { resolve(`sleep ${time} ms`); }, time); }); }; let start = async () => { console.log('start'); let result = await sleep(2000); console.log(result); console.log('end'); }; start();

    promise

    //ES6 规定,Promise对象是一个构造函数,用来生成Promise实例 const promise = new Promise(function(resolve, reject) { // ... some code if (/* 异步操作成功 */){ resolve(value); } else { reject(error); } }); // 用promise实现ajax const getJSON = function(url) { const promise = new Promise(function(resolve, reject){ const handler = function() { if (this.readyState !== 4) { return; } if (this.status === 200) { resolve(this.response); } else { reject(new Error(this.statusText)); } }; const client = new XMLHttpRequest(); client.open("GET", url); client.onreadystatechange = handler; client.responseType = "json"; client.setRequestHeader("Accept", "application/json"); client.send(); }); return promise; }; getJSON("/posts.json").then(function(json) { console.log('Contents: ' + json); }, function(error) { console.error('出错了', error); });

    Object.is()

    ES5 比较两个值是否相等,只有两个运算符:相等运算符(==)和严格相等运算符( === )。它们都有缺点,前者会自动转换数据类型,后者的NaN不等于自身,以及+0等于-0。ES6用Object.is() 来解决这个问题————“Same-value equality”(同值相等)算法

    Object.is('foo', 'foo') // true Object.is({}, {}) // false +0 === -0 //true NaN === NaN // false Object.is(+0, -0) // false Object.is(NaN, NaN) // true <!--ES5通过下面的代码部署Object.is--> Object.defineProperty(Object, 'is', { value: function(x, y) { if (x === y) { // 针对+0 不等于 -0的情况 return x !== 0 || 1 / x === 1 / y; } // 针对NaN的情况 return x !== x && y !== y; }, configurable: true, enumerable: false, writable: true });

    reduce

    数组的reduce方法用途很广。它一般被用来把数组中每一项规约到单个值。但是你可以利用它做更多的事。

    <!--同时实现map和filter--> const numbers = [1,2,3,4] const doubledOver50 = numbers.reduce((finalList,num) = { num = num * 2; if (num > 5) { finalList.push(num) } }, [])

    最新回复(0)