ES6语法

149 阅读2分钟

let const

  • 尽量使用let替换var,let更为严谨必须先声明再使用;
  • const 常量,直接看代码吧:
const a;	// Uncaught SyntaxError: Missing initializer in const declaration
const aaa = 9;
aaa = 3;	// Uncaught SyntaxError: Assignment to constant variable.

多行字符串及拼接

let string =
    `这是一个多行字符串
第二行`
const string1 = `Hey
    this
    string
    is awesome!`
const string2 = `First
         Second`
const string3 = `
    First
    Second`.trim()
document.getElementById('string1').innerHTML = string1
document.getElementById('string2').innerHTML = string2
document.getElementById('string3').innerHTML = string
document.getElementById('string4').innerHTML = string3

const var1 = '一个变量'
const string4 = `something ${var1}` //something test
document.getElementById('string5').innerHTML = string4

遍历

//iterate over the value
for (const v of ['a', 'b', 'c']) {
    console.log(v);
}
//get the index as well, using `entries()`获取索引
for (const [index, value] of ['a', 'b', 'c'].entries()) {
    console.log(index + '===' + value)
}

对象展开运算符...

const {
    first,
    second,
    ...others
} = {
    first: 1,
    second: 2,
    third: 3,
    fourth: 4,
    fifth: 5
}
console.log('...fist: ' + first)
console.log('...others: ' + JSON.stringify(others))
document.write('展开:')
const items = {
    first,
    second,
    ...others
}
console.log(items) // {first: 1, second: 2, third: 3, fourth: 4, fifth: 5}
console.log(items.first) // 1

set

const s = new Set()
s.add('one')
s.add('two')
s.has('one') // true
s.delete('one')
s.add('three')
// s.clear()
// 两种遍历方式等价
// 		for (let j of s) {
// 			console.log('set内容:' + j)
// 		} 
for (const k of s.values()) {
    console.log('set内容:' + k)
}
s.forEach(v => console.log('v:' + v))
let set = new Set([1, 4, 9]);
set.forEach((value, key) => console.log(key + ' : ' + value))
for (let item of s.keys()) {
    console.log('keys()方式:' + item);
}

// 将set 转换一个数组
const b = [...s.keys()]
// or
const a = [...s.values()]

// WeakSet
// WeakSet 不可迭代
// 你不能清空 weakSet 中的所有元素
// 不能够得到 weakSet 的大小
// 可用方法 add() has() delete()
  • set还可以用来数组去重
let arr = [1,2,3,3,3,3];
console.log([...new Set(arr)]); // 1 2 3  超级好用

也就是说set只能存储唯一值,如果是对象也必须指向不同引用

map

const m = new Map()
m.set('color', 'red')
m.set('age', 2)
const color = m.get('color')
const age = m.get('age')
console.log('map color: ' + color)
console.log('map age: ' + age)
// m.delete('color')
// m.clear()	// 清除所有
m.has('color') // true
console.log('map.size(): ' + m.size)
for (const k of m.keys()) {
    console.log('map keys遍历: ' + k)
}
for (const v of m.values()) {
    console.log('map values遍历: ' + v)
}
for (const [k, v] of m.entries()) {
    console.log('map entires遍历:' + k, v)
}
// 转换数组
const c = [...m.keys()]
const d = [...m.values()]
const map = new Map([
    ['color', 'red'],
    ['owner', 'Flavio'],
    ['age', 2]
])
// 同样有weakmap

箭头函数 () => {}

更为简洁的语法,箭头函数中没有this,继承上层this

(arg1, arg2) => {
    // 函数体
    return arg1;
}
// 如果参数只有一个,函数体只有一行甚至可以
result => return result

参数解构

const {obj1, obj2} = base;

import

导入导出请看export & export default & module.exports 与模块化规范有关

继承

请看‘原型链&继承’

还没写完