ES6知识点学习笔记分享

var {x=3}={x:undefined} //x =3 var {x=3}={x:null}//x=null

var {foo}={bar:'baz'}

var [(a)]=[1]   //报错 var{x:(c)}={}  //报错 var {o:({p:p})}={o:{p:2}}//报错

function f([(z)]){ return z;}

（{p:a})={p:42}

([a])=[5]

[(b)]=[3] ({p:(d)}={}) [(parseInt.prop)]=[3] //以上都正确

function f([x,y,z]){...} f([1,2,3])

function f({x,y,z}){...} f({z:3,y:2,x:1})

jQuery.ajax = function (url, {   async = true,   beforeSend = function () {},   cache = true,   complete = function () {},   crossDomain = false,   global = true,   // ... more config }) {   // ... do stuff };

var map = new Map(); map.set('first', 'hello'); map.set('second', 'world'); for (let [key, value] of map) {   console.log(key + " is " + value); }

'x'.padStart(5,'ab')//ababx 'x'.padStart(4,'ab')//abax

'x'.padEnd(5, 'ab') // 'xabab' 'x'.padEnd(4, 'ab') // 'xaba'

. 字符会匹配换行意外的任意字符,但是在大于0xffffd Unicode字符就不能识别了, 这时候需要加上U模式茶能识别

ES6新增了使用大括号表示Unicode字符的表示法, 在正则表达式中必须加U修饰符才能识别到

使用u修饰符后，所有量词都会正确识别大于码点大于0xFFFF的Unicode字符。

u修饰符也影响到预定义模式，能否正确识别码点大于0xFFFF的Unicode字符。

Math.trunc(4.1) // 4 Math.trunc(4.9) // 4

Math.trunc('123.456')

参数为正数，返回+1； 参数为负数，返回-1； 参数为0，返回0； 参数为-0，返回-0; 其他值，返回NaN

Math.cbrt(1)  // 1

Math.clz32(0)//32 Math.clz32(1000)//22

Math.clz32(1<<1)//30 Math.clz32(1<<2)//29

Math.imul(2, 4)   // 8 Math.imul(-1, 8)  // -8 Math.imul(-2, -2) // 4

Math.fround(0)     // 0 Math.fround(1)     // 1 Math.fround(1.337) // 1.3370000123977661 Math.fround(1.5)   // 1.5 Math.fround(NaN)   // NaN

Math.hypot(3, 4);        // 5 Math.hypot(3, 4, 5);     // 7.0710678118654755 Math.hypot();            // 0 Math.hypot(NaN);         // NaN Math.hypot(3, 4, 'foo'); // NaN

// ES5的写法 var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c'] // ES6的写法 let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']

它的参数是一个回调函数，所有数组成员依次执行该回调函数， 直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员， 则返回undefined。

[1, 4, -5, 10].find((n) => n < 0) // -5

[1, 5, 10, 15].find(function(value, index, arr) {   return value > 9; }) // 10

[1, 5, 10, 15].findIndex(function(value, index, arr) {   return value > 9; }) // 2

['a', 'b', 'c'].fill(7) // [7, 7, 7] new Array(3).fill(7) // [7, 7, 7]

keys()是对键名的遍历

values()是对键值的遍历

entries()是对键值对的遍历

function foo({x, y = 5}) {   console.log(x, y); } foo({}) // undefined, 5 foo({x: 1}) // 1, 5 foo() // TypeError: Cannot read property 'x' of undefined 如果函数foo调用时参数不是对象，变量x和y就不会生成，从而报错。 也就是说参数不能省略

function fetch(url, { method = 'GET' } = {}) {   console.log(method); } fetch('http://example.com') // "GET"

(function (a) {}).length // 1 (function (a = 5) {}).length // 0 (function (a, b, c = 5) {}).length // 2

(function (a = 0, b, c) {}).length // 0 (function (a, b = 1, c) {}).length // 1

let foo = 'outer'; let f = x => foo; function bar(func = f) {   let foo = 'inner';   console.log(func()); // outer } bar();

function throwIfMissing() {   throw new Error('Missing parameter'); } function foo(mustBeProvided = throwIfMissing()) {   return mustBeProvided; } foo() // Error: Missing parameter

// ES5 [1, 2].concat(more) // ES6 [1, 2, ...more]

[...arr1, ...arr2, ...arr3]

const [...butLast, last] = [1, 2, 3, 4, 5]; // 报错 const [first, ...middle, last] = [1, 2, 3, 4, 5]; // 报错

[...'hello'] // [ "h", "e", "l", "l", "o" ]

let map = new Map([[1,'one'],[2,'two'],[3,'three']]);

子主题

子主题

class Point {   constructor(x, y) {     Object.assign(this, {x, y});   } }

Object.assign(SomeClass.prototype, {   someMethod(arg1, arg2) {     ···   },   anotherMethod() {     ···   } }); // 等同于下面的写法 SomeClass.prototype.someMethod = function (arg1, arg2) {   ··· }; SomeClass.prototype.anotherMethod = function () {   ··· };

当时不能克隆对象原型链上面的值

能克隆对象原型链上面的值

const merge =   (target, ...sources) => Object.assign(target, ...sources);

const merge =   (...sources) => Object.assign({}, ...sources);

const DEFAULTS = {   logLevel: 0,   outputFormat: 'html' }; function processContent(options) {   let options = Object.assign({}, DEFAULTS, options); }

上面代码中 default是默认值,option对象是用户提供的参数,将他们合并成一个对象

DEFAULTS对象和options对象的所有属性的值，都只能是简单类型， 而不能指向另一个对象。否则，将导致DEFAULTS对象的该属性不起作用。

var obj = { foo: "bar", baz: 42 }; Object.values(obj) // ["bar", 42]

Ojbect.values('foo') //['f','o','o']

var obj = { foo: 'bar', baz: 42 }; Object.entries(obj) // [ ["foo", "bar"], ["baz", 42] ]

var obj = { foo: 'bar', baz: 42 }; var map = new Map(Object.entries(obj)); map // Map { foo: "bar", baz: 42 }

let set = new Set(); set.add({}); set.size // 1 set.add({}); set.size // 2

add(value)

delete(value)

has(value)

clear()

Array.from方法可以将Set结构转为数组

去除数组重复成员的方法

keys()

values()

entries()

forEach()

for...of循环遍历Set

数组的map和filter方法也可以用于Set了

因此使用Set，可以很容易地实现并集（Union）、交集（Intersect）和差集（Difference）。

如果想在代码中直接改变遍历改变原来的set内容

WeakSet的成员只能是对象，而不能是其他类型的值。

垃圾回收机制不考虑WeakSet对该对象的引用

不可遍历

add(value)

delete(value)

has(value)

size属性返回Map结构的成员总数

set方法设置key所对应的键值，然后返回整个Map结构。

get方法读取key对应的键值，如果找不到key，返回undefined。

has方法返回一个布尔值，表示某个键是否在Map数据结构中。

delete方法删除某个键，返回true。如果删除失败，返回false。

clear方法清除所有成员，没有返回值。

keys()：返回键名的遍历器。 values()：返回键值的遍历器。 entries()：返回所有成员的遍历器。 forEach()：遍历Map的所有成员。

let map = new Map([   [1, 'one'],   [2, 'two'],   [3, 'three'], ]); [...map.keys()] // [1, 2, 3] [...map.values()] // ['one', 'two', 'three'] [...map.entries()] // [[1,'one'], [2, 'two'], [3, 'three']] [...map] // [[1,'one'], [2, 'two'], [3, 'three']]

let map0 = new Map()   .set(1, 'a')   .set(2, 'b')   .set(3, 'c'); let map1 = new Map(   [...map0].filter(([k, v]) => k < 3) ); // 产生Map结构 {1 => 'a', 2 => 'b'} let map2 = new Map(   [...map0].map(([k, v]) => [k * 2, '_' + v])     ); // 产生Map结构 {2 => '_a', 4 => '_b', 6 => '_c'}

let myMap = new Map().set(true, 7).set({foo: 3}, ['abc']); [...myMap] // [ [ true, 7 ], [ { foo: 3 }, [ 'abc' ] ] ]

将数组转入Map构造函数，就可以转为Map。

function strMapToObj(strMap) {   let obj = Object.create(null);   for (let [k,v] of strMap) {     obj[k] = v;   }   return obj; } let myMap = new Map().set('yes', true).set('no', false); strMapToObj(myMap) // { yes: true, no: false }

function objToStrMap(obj) {   let strMap = new Map();   for (let k of Object.keys(obj)) {     strMap.set(k, obj[k]);   }   return strMap; } objToStrMap({yes: true, no: false}) // [ [ 'yes', true ], [ 'no', false ] ]