ES6+

271 阅读3分钟

var 申明的变量可以在window上获取

const let 

解构赋值

对象结构,数组解构,字符串解构

字符串也可以for循环

字符串解构和数组解构一样的

let [a , b, c,d = 5] = [1, ,2 , 3] 可以设置默认值

数组

Array.form()

Array.of()

fill()

copyWithin() 替换元素

arr.copyWithin(1, 2, 3)  可以颠倒数组顺序

includes()

函数的默认值

function foo(x =5){}

函数对象的默认参数

 function ajax(name = 6, {method = 'POST'} = {}) {

console.log(name)

console.log(method)

}

ajax.length获取没有指定默认值的参数个数

arr.slice() 复制一个数组,复制第一层,浅拷贝

false null === null 

true undefined === Number

true undefined === undefined 

class中有get和set方法,用来设置和改变属性的方法

class {

  get(){ 获取属性的值

  }

  set(val){   改变属性的值,

  }

}

Set

const s = new Set([1, 2])

s.add(4)

s.delete(2)

s.clear()

s.has(1)

s.size

s.forEach

Array.from(s)  转换成数组

[...s]

应用场景,数组去重

WeakSet 主要用于对象,是弱引用,不能循环遍历

WeakMap 的 key 只能是 Object 类型。 原始数据类型 是不能作为 key 的(比如 Symbol)。

可以防止内存泄漏

Object.defineProperty

    let newVal = ''

Object.defineProperty(obj, 'name', {

get() {

return newVal

},

set(val) {

console.log("set", val)

newVal = val

}

})

obj.name = 666

console.log(obj.name)

Reflect 和 Proxy 的方法是一一对应的

Reflect相当于就是操作对象,数组的方法,为以后更统一

获取属性 Reflect.get(obj, name)

设置 Reflect.set(obj, name, val)

判断是否有这个属性 Reflect.has(obj, name)

Reflect.ownKeys(obj)  返回对象的属性组成的数组

****删除属性Reflect.deleteProperty (obj, name)

Promise.allSettled 返回成功或者失败的,status判断状态

**Promise.all()只要有一个失败了,就全部失败
**

iterator  只要有Symbole[iterator]这个属性就可以用of循环

const arr = [1, 2, 4, 6]

const it = arr[Symbol.iterator]()

const a = it.next()

console.log(as)

可迭代协议:Symbol.iterator

迭代器协议:return { next(){ return{value, done} }}

ES7

Array.prototype.includes()  

includes()第二个参数,表示从哪个位置开始找,可以是负数,负数表示,从最后开始找

arr.indexOf(NaN) 不能判断是否有NaN

Math.pow(2, 10) 2的10次方

ES8

async await

Object.values()

Object.entries() 返回一个二维数组,键值对的形式,可以用for of循环

Object.getOwnPropertyDescriptors() 返回对象的属性,以及详细信息,是否可以枚举,可以修改,可以删除

str.padStart() 补全字符串,第一个参数,表示填充多长,第二个参数表示用什么补全

str.padEnd()

函数参数最后一个参数后面可以加个逗号,主要是为了多人协作避免冲突

// configurable 是否可以通过delete把这个属性删除掉

// writable 是否可以修改

// enumerable 可以可以枚举,可以可以通过循环拿到

ES9

for await of 异步迭代

Symbole.asynciterator

对象的展开运算...

Promise.prototype.finally()  不管成功或者失败都会执行,主要用着loading中,不管成功还是失败,都要关闭loading

模板字符串可以当函数来解析

const foo = (a, b, c, d) => {

console.log(a)

console.log(b)

console.log(c)

console.log(d)

}

// foo(1, 2, 3, 4)

const name = 'xiecheng'

const age = 34

foo`这是name,他的年龄是{name}, 他的年龄是{age}岁`

ES10

Object.formEntries()

String.prototype.trimStart()

String.prototype.trimEnd()

Array.prototype.flat()    arr.flat(Infinity) 值是几就扁平多少层

Array.prototype.flatMap()

Function.prototypr.toString()

可选Catch try {}Catch{}

Symbol.prototype.description

ES11

BigInt

import().then()动态导入

Promise.allSettled()成功或者失败都会返回,根据status状态去判断是成功还是失败

globalThis  全局this, 在nodejs或者在浏览器中都可以用这个

可选链 当对象有这个属性时,才继续

const street = user?.address?.street

const num = user?.address?.getNum?.()

之前的方法 user && user.address && user.address.street

空值合并运算符

const a = b ?? 6 只有b是null或者是undefined才取第二个值