ES6应用小技巧

这是我参与更文挑战的第13天，活动详情查看：更文挑战

1、 使用Set实现数组去重

在ES6中，因为Set只存储唯一值，所以你可以使用Set删除重复项。

let arr = [1, 1, 2, 2, 3, 3];
let deduped = [...new Set(arr)] // [1, 2, 3]
// reduce数组对象去重
var obj = {};
points = points.reduce(function(list, next) {
    obj[next.lat] ? '' : obj[next.lat] = true && list.push(next);
    return list;
}, []);
 console.log(points)  ;  
复制代码

2、合并对象

ES6带来了扩展运算符（…）。它一般被用来解构数组，但你也可以用它处理对象。也可以用来做浅拷贝，当数据只有一层时(如下),可以实现深拷贝。深拷贝实现方式：juejin.cn/post/697084…

接下来，我们使用扩展运算符来展开一个新的对象，第二个对象中的属性值会改写第一个对象的属性值。比如object2的b和c就会改写object1的同名属性。

let object1 = { a:1, b:2,c:3 }
let object2 = { b:30, c:40, d:50}
let merged = {…object1, …object2}
console.log(merged) // {a:1, b:30, c:40, d:50}
复制代码

3、结构赋值

let [a, b, c] = [1, 2, 3];
//定义了三个变量，并对应赋了值；如果值的个数与变量名个数不匹配，没有对应上的变量值为 undefined
复制代码

4、模块化

//a.js 定义
let a = {a:1,b:2,c:3};
export default a;

// 引入
import a from 'a.js';
console.log(a.a); 

// c.js 
export const arr = [{a: 1},{b:2}]
// 引入
import {arr} from 'c.js'

复制代码

export 和export default 的区别：

• export与export default均可用于导出常量、函数、文件、模块等
• export default是模块的默认对外接口，只有一个，所以只能出现一次。
• export 可以直接导出或者先定义后导出都可以，可以有多个。

5、数组过滤

var newarr = [
  { num: 1, val: 'ceshi', flag: 'aa' },
  { num: 2, val: 'ceshi2', flag: 'aa2'  }
]
console.log(newarr.filter(item => item.num===2 ))
//  [{"num":2,"val":"ceshi2","flag":"aa2"}]
复制代码

6、默认参数

function show_hi(s='hi') {

    console.log(s)
    // hi
}

复制代码

7、 字符串模板“

var name = `my name is ${username} `;
复制代码