ES6 Review of Basic Knowledge
let a = 1
console.log('a')
const b = 1
let binary = 0B0101
console.log(binary)
let oo = 0o32
console.log(oo)
console.log(Number.isNaN(1)) // false
console.log(Number.isNaN(NaN))
console.log(Number.MAX_SAFE_INTEGER)
console.log(Number.isSafeInteger(oo))
// Array.form
let json = {
'0': '1',
'1': '2',
'2': '222',
length: 3
}
console.log(Array.from(json))
// Array of
let arr = Array.of(3,4,5,6)
console.log(arr)
// find()实例方法
console.log(arr.find((value, index, arr) => {
return value > 4
})) // 5
// fill
let arr1 = [1,2,4,5]
console.log(arr1.fill('aaa', 1, 3)) // [1, "aaa", "aaa", 5]
// for of
for(let i of arr1.keys()) {
console.log(i)
}
// entries条目
for(let [index, val ] of arr1.entries()) {
console.log(`${index}: ${val}`)
//0: 1
// 1: aaa
// 2: aaa
// 3: 5
}
let list = arr1.entries()
console.log(list.next().value) //[0, 1]
console.log(list.next()) // {value: Array(2), done: false}
// throw new Error('aaa')
// 对象的函数解构
let json1 = {
'name': '2oops',
'age': 20
}
function fun({ name, age = 21 }) {
console.log(name, age)
}
fun(json1)
// in
let obj = {
name: '2oops',
age: 20
}
console.log(name in obj) // 0 2oops
// forEach
let arr2 = ['2oops', 21]
arr2.forEach((val, index) => {console.log(index, val)})
// filter
let res = arr2.filter(x => { return x === 21})
console.log(res) // [21]
// some
arr2.some(x => console.log(x)) // 2oops 21
// map 替换
let res1 = arr2.map(item => 'haha')
console.log(res1) // ['haha', 'haha']
// join
console.log(arr2.join('-')) //2oops-21
// key值的构建
let key = "name"
let obj2 = {
[key]: '2oops'
}
console.log(obj2)
// is严格相等
let obj3 = {name: '2oops'}
let obj4 = {name: '2oops'}
console.log(Object.is(obj3.name, obj4.name)) //true
console.log( +0 === -0) // true
console.log(NaN === NaN) // false
console.log(Object.is(+0, -0)) //false
console.log(Object.is(NaN, NaN)) //true
// assign()
let obj5 = {age: 20}
let obj6 = Object.assign(obj4, obj5)
console.log(obj6)
// symbol
let f = Symbol()
console.log(typeof(f)) // Symbol
let oops = Symbol('2oops')
console.log(oops) // Symbol(2oops)
console.log(oops.toString()) // Symbol(2oops)
let obj7 = {
[f]: '2oops'
}
obj7[f] = '2'
console.log(obj7[f])
// symbol的对象保护
let xiaowang = {
name: 'xiaowang',
age: '20',
// phoneNumber: '2131241234'
}
// 保护phoneNumber
let phoneNumber = Symbol()
xiaowang[phoneNumber] = '31432432'
for( let item in xiaowang) {
console.log(xiaowang[item])
}
console.log(xiaowang[phoneNumber])
// set去重
let setArr = new Set(['2oops', 20, 20]) //不允许重复
console.log(setArr) //Set(2) {"2oops", 20}
setArr.add('xiaopp') // 添加
setArr.delete(20) // 删除
// setArr.clear() // 全部删除 Set {}
console.log(setArr)
// has查找
console.log(setArr.has(20)) // false
for( let item of setArr) {
console.log(item)
}
setArr.forEach(x => console.log(x))
console.log(setArr.size) //去重后的大小
// weakSet
let weakObj = new WeakSet()
// 须要使用add添加对象
let oops1 = {name: '2oops'}
weakObj.add(oops1) //add 的对象要写在外面
// 且即使对象完全相等,但栈内存不一样就都会add进weakSet
console.log(weakObj)
// map数据类型
let json2 = {
name: 'xiaopp',
age: 21
}
console.log(json2.name)
let map1 = new Map()
map1.set(json2, 'hello')
console.log(map1) // Map(1) {{…} => "hello"}
map1.set('oops', json2)
console.log(map1) // Map(2) {{…} => "hello", "oops" => {…}}
// 增删改查
console.log(map1.get('oops'))
console.log(map1.get(json2))
map1.delete(json2)
// map1.clear()
console.log(map1.size)
console.log(map1.has('oops'))
// Proxy 增强对象和函数(方法) 生命周期 预处理
let pro = {
add: (x) => {
return x + 100
},
name: '2oops'
}
let proxy1 = new Proxy({
add: (x) => {
return x + 100
},
name: '2oops'
}, {
// get set apply
get: (target, key, property) => {
console.log('come in get')
return target[key]
},
set: (target, key, value, receiver) => {
console.log(`setting ${key} to value ${value}`)
return target[key] = value
}
})
console.log(proxy1.name) // 2oops
proxy1.name = 'changed'
console.log(proxy1.name) // changed
let target = () => 'hello 2oops'
let handler = {
apply(target, ctx, args) {
console.log('applying')
return Reflect.apply(...arguments)
}
}
let proxy2 = new Proxy(target, handler)
console.log(proxy2()) // applying hello 2oops
// Promise 解决回调地狱的问题
let state = 1
function step1(resolve, reject) {
console.log('start step1')
if(state === 1) {
resolve('step1 resolved')
} else {
reject('step1 rejected')
}
}
function step2(resolve, reject) {
console.log('start step2')
// state = 0
if(state === 1) {
resolve('step2 resolved')
} else {
reject('step2 rejected')
}
}
function step3(resolve, reject) {
console.log('start step3')
if(state === 1) {
resolve('step3 resolved')
} else {
reject('step3 rejected')
}
}
new Promise(step1).then(val => {
console.log(val)
return new Promise(step2)
}).then(val => {
console.log(val)
return new Promise(step3)
}).then(val => {
console.log(val)
})
// class
class Animal{
name(val) {
console.log(val)
return val
}
// 方法之间不要写逗号
skill() {
// this指的是class这层
console.log(this.name('xiaop'))
}
constructor(a, b) {
this.a = a
this.b = b
}
add() {
return this.a + this.b
}
}
let dog = new Animal(1,3)
dog.name('pp')
dog.skill()
console.log(dog.add()) // 4
class Cat extends Animal {
}
let cat = new Cat
cat.name('miaomiao')
发表评论 (审核通过后显示评论):