// 一、 变量的解构 提取JSON的数据 函数返回的数据对象 遍历map解构
function example() {
return {
foo: 1,
bar: 2
};
}
let { foo, bar } = example();
let jsonData = {
id: 42,
status: "OK",
data: [867, 5309]
};
let { id, status, data: number } = jsonData;
// console.log(id, status, number);
// 扩展:变量解构的常用实例
// const { SourceMapConsumer, SourceNode } = require("source-map");
// 二、 字符串的扩展 遍历字符串 常用的字符串模版
for (let codePoint of 'foo') {
// console.log(codePoint)
}
// 字符串新增的方法 常用的includes 替代 indexof, trim消除字符的空格比较常用
// includes() :返回布尔值,表示是否找到了参数字符串。
// trim(): 消除字符串的空格
// 三、 数值的扩展
// Number.isFinite()用来检查一个值是否为有效的数值
// 四、 数组的扩展 数组的合并 新写法 数组的includes方法 返回一个布尔值,表示某个数组是否包含给定的值
const arr1 = ['a', 'b'];
const arr2 = ['c'];
const arr3 = ['d', 'e'];
// ES5 的合并数组
arr1.concat(arr2, arr3);
// [ 'a', 'b', 'c', 'd', 'e' ]
// ES6 的合并数组
[...arr1, ...arr2, ...arr3]
// [ 'a', 'b', 'c', 'd', 'e' ]
// 五、 对象的新方法 Object.assign 方法用于对象的合并
const target = { a: 1 };
const source1 = { b: 2 };
const source2 = { c: 3 };
Object.assign(target, source1, source2);
// 六、 新增set结构
// Array.from方法可以将 Set 结构转为数组。
// 数组去重 新方法
function dedupe(array) {
return Array.from(new Set(array));
}
dedupe([1, 1, 2, 3]) // [1, 2, 3]
// 七、 规范编码
// 声明多个变量
// bad
var a = 1, b = 2, c = 3;
// best
const [a, b, c] = [1, 2, 3];
// 获取数据 解构赋值
const arr = [1, 2, 3, 4];
// bad
const first = arr[0];
const second = arr[1];
// good
const [first, second] = arr;
// 获取数据 解构复制 解构函数测参数
// bad
function getFullName(user) {
const firstName = user.firstName;
const lastName = user.lastName;
}
// good
function getFullName(obj) {
const { firstName, lastName } = obj;
}
// best
function getFullName({ firstName, lastName }) {
}
// 数组 使用扩展运算符(...)拷贝数组。
// good
const itemsCopy = [...items];
// 使用 Array.from 方法,将类似数组的对象转为数组。
const foo = document.querySelectorAll('.foo');
const nodes = Array.from(foo);