关于es6、webpack项目中常用的点

项目常用的es6的几个点

• （一）块级作用域的使用
   es5并没有块级作用域的概念，有的是全局作用域和函数作用域，而let的出现就是为了打破局面，let是块级作用域。const是代表常量，必须在定义的时候初始化，不可改变。

• （二）字符串的拼接
  

// 字符模板的写法
 var s1 = '染';
 var s2 = '你的好';
 var str = `孩子们：请听我说！${s2}白天和黑夜。${s1}核糖体在mRNA上穿梭忙碌，几千种酶。`;

• （三）解构赋值
  

// 注意数组是有顺序的
  var [a,b,c] = [11,22,33];
  console.log(a,b,c); // 11 22 33

// 当然解构赋值还有嵌套比较复杂的写法，如下
   let [foo,[[bar],[baz]]] = [111,[[222],[333]]];
   console.log(foo,bar,baz); // 111 222 333

   let [head,...foot] = [1,2,3,4];
   console.log(head,foot); // 1 [2,3,4]

• （四）数组的深拷贝
   数组的浅拷贝，引用之间的拷贝，没有实现数组的真正复制,es6深拷贝简便 的两种方法

//ES6实现的数组的深拷贝方法1
  var arr1 = [1,2,3];
  var arr2 = Array.from(arr1);
//ES6实现的数组的深拷贝方法2
  var arr1 = [1,2,3];
  // 超引用拷贝数组
  var arr2 = [...arr1];

• （五）Promise
   在promise之前代码过多的回调或者嵌套，可读性差、耦合度高、扩展性低。通过Promise机制，扁平化的代码机构，大大提高了代码可读性；用同步编程的方式来编写异步代码，保存线性的代码逻辑，极大的降低了代码耦合性而提高了程序的可扩展性。未完待续

• （六）箭头函数=>
   ES6 中，箭头函数就是函数的一种简写形式，使用括号包裹参数，跟随一个 =>，紧接着是函数体，之前，我们经常需要使用一个变量来保存this，箭头函数就省去了这个麻烦，箭头函数里this的指向是当前使用的位置，无需追溯定义this的位置

• （七）js判断数组的5种方式
   Array.isArray(arr)

webpack

插件UglifyJsPlugin

config.plugins.push(
                new UglifyJsPlugin({
                    uglifyOptions: {
                        compress: {
                            drop_console: true,// 注释console
                            drop_debugger: false, // 注释debugger
                            pure_funcs: ["console.log"] //移除console
                        },
                        // warnings: false,
                        mangle: false,
                        output: {
                            beautify: true //压缩注释
                        }
                    },
                    sourceMap: false,// 去除打包后生成的.map文件
                    parallel: true
                }),
            );