ES6入门笔记(初)
参照http://es6.ruanyifeng.com/ 学习,写的非常不错,难得有写的这么好的开发学习资料,简单易懂,非常方便查询
http://es6.ruanyifeng.com/#docs/style 编码风格(好)必学
function example() {
return {
foo: 1,
bar: 2
};
}
let { foo, bar } = example();
解构赋值对提取 JSON 对象中的数据,尤其有用
let jsonData = {
id: 42,
status: "OK",
data: [867, 5309]
};
let { id, status, data: number } = jsonData;
遍历 Map 结构
const map = new Map();
map.set('first', 'hello');
map.set('second', 'world');
for (let [key, value] of map) {
console.log(key + " is " + value);
}
// 获取键名 for (let [key] of map) {}
// 获取键值 for (let [,value] of map) {}
http://es6.ruanyifeng.com/#docs/string
includes(), startsWith(), endsWith()
- includes():返回布尔值,表示是否找到了参数字符串。
- startsWith():返回布尔值,表示参数字符串是否在原字符串的头部。
- endsWith():返回布尔值,表示参数字符串是否在原字符串的尾部。
这三个方法都支持第二个参数,表示开始搜索的位置。
let s = 'Hello world!'; s.startsWith('world', 6) // true
repeat方法返回一个新字符串,表示将原字符串重复n次 'x'.repeat(3) // "xxx"
padStart和padEnd一共接受两个参数,第一个参数用来指定字符串的最小长度,第二个参数是用来补全的字符串。'x'.padStart(4, 'ab') // 'abax'; 'x'.padEnd(5, 'ab') // 'xabab'
模板字符串中嵌入变量,需要将变量名写在${}
合并数组// ES6 的合并数组[...arr1, ...arr2, ...arr3]
http://es6.ruanyifeng.com/#docs/module
整体加载:import * as circle from './circle'; 如果circle有多个export,最好不使用,使用一个输出
模块整体加载所在的那个对象(上例是circle),应该是可以静态分析的,所以不允许运行时改变
export default命令,为模块指定默认输出。上面代码的两组写法,第一组是使用export default时,对应的import语句不需要使用大括号;第二组是不使用export default时,对应的import语句需要使用大括号。
如果模块默认输出一个函数,函数名的首字母应该小写。如果模块默认输出一个对象,对象名的首字母应该大写。
http://es6.ruanyifeng.com/#docs/style
ESLint 是一个语法规则和代码风格的检查工具,可以用来保证写出语法正确、风格统一的代码。
静态字符串一律使用单引号或反引号,不使用双引号。动态字符串使用反引号。
在let和const之间,建议优先使用const,尤其是在全局环境,不应该设置变量,只应设置常量。const b = `foo${a}bar`;
解构赋值
使用数组成员对变量赋值时,优先使用解构赋值。const [first, second] = arr;
对象: const b = { k1: v1, k2: v2,}; 注意单行定义的对象,最后一个成员不以逗号结尾。多行定义的对象,最后一个成员以逗号结尾。
使用扩展运算符(...)拷贝数组。const itemsCopy = [...items];
使用 Array.from 方法,将类似数组的对象转为数组。const nodes = Array.from(foo);
函数:立即执行函数可以写成箭头函数的形式。(() => {console.log('Welcome to the Internet.');}) 使用函数表达式的场合,尽量用箭头函数代替。因为这样更简洁,而且绑定了 this。
rest 运算符(...)可以提供一个真正的数组