ES6入门到进阶（二）：循环、数组、对象

摘要：优点按需加载可以写中路径也可以动态加以后默认就是严格模式，默认严格模式完参考视频资料经典入门到进阶

ES5里面新增一些东西

    1. for
        for(let i=0; i
1.2 arr.map()(常用)
arr.map()  //  `非常有用，做数据交互`  "映射"
    正常情况下，需要配合return，返回是一个新的数组
    若是没有return，相当于forEach

    注意：平时只要用map，一定是要有return
    
    重新整理数据结构:
        [{title:"aaa"}]   ->  [{t:"aaaa"}]

1.3 arr.filter():  过滤，过滤一些不合格“元素”， 如果回调函数返回true，就留下来

1.4 arr.some() 和 arr.every()
arr.some(): 类似查找,  数组里面某一个元素符合条件，返回true
arr.every(): 数组里面所有的元素都要符合条件，才返回true

其实他们可以接收两个参数:
    arr.forEach/map...(循环回调函数, this指向谁);
------------------------------------------------------------
arr.reduce()   //从左往右
    求数组的和、阶乘

    
arr.reduceRight()  //从右往左
------------------------------------------------------------    

ES2017新增一个运算符:**
幂
    Math.pow(2,3)等价于：2 ** 3
======================================================
for....of....：
arr.keys()    数组下标
arr.entries()    数组某一项

for(let val of arr){
    console.log(val);
}
二、数组
2.1 扩展运算符:
...

let arr =[1,2,3];
复制数组：let arr2 = [...arr];

let arr2 = Array.from(arr);


2.2 Array.from

作用: 把类数组(获取一组元素、arguments...) 对象转成数组
个人观点： 具备 length这个东西，就靠谱

Array.of():  把一组值，转成数组
let arr = Array.of("apple","banana","orange");

console.log(arr);
2.3 find,findIndex,fill
arr.find():  查找，找出第一个符合条件的数组成员，如果没有找到，返回undefined

arr.findIndex(): 找的是位置， 没找到返回-1
arr.fill()：填充
   arr.fill(填充的东西, 开始位置, 结束位置);
在ES2016里面新增:
arr.indexOf()
arr.includes()
    str.includes()

三、对象
3.1 对象简洁语法(相当有用)
    
===>
new Vuex.Store({
    state,
    mutation,
    types,
    actions
});

new Vue({
    router,
    App,
    vuex
})

3.2 Object.is()
用来比较两个值是否相等

Object.is("a","a");

比较两个东西相等:
    ==
    ===

Object.is(NaN, NaN); //true

Object.is(+0, -0); //false

Object.assign():   用来合并对象
let 新的对象 = Object.assign(目标对象, source1, srouce2....)

function ajax(options){  //用户传
    let defaults={
        type:"get",
        header:
        data:{}
        ....
    };

    let json = Object.assign({}, defaults, options);
    .....
}


用途:
    1. 复制一个对象
    2. 合并参数

ES2017引入:
Object.keys()
Object.entries();
Object.values();

    let {keys, values, entries} = Object;let {keys, values, entries} = Object;

对象身上:   计划在ES2018引入
...

let json = {a:3, b:4};
        let json2 = {...json};

四、Promise
承诺，许诺
作用:  解决异步回调问题
传统方式，大部分用回调函数，事件
ajax(url,{  //获取token
    ajax(url,()=>{  //获取用户信息
        ajax(url, ()=>{
            //获取用户相关新闻
        })
    })
})

4.1 语法
    let promise = new Promise(function(resolve, reject){
        //resolve,   成功调用
        //reject     失败调用
    });

    promise.then(res=>{

    }, err=>{
        
    })

//捕获错误
promise.catch(err=>{})

本人用法:
    new Promise().then(res=>{

    }).catch(err=>{
        
    })

Promise.resolve("aa") :  将现有的东西，转成一个promise对象， resolve状态，成功状态
    等价于:
    new Promise(resolve =>{
        resolve("aaa")
    });
Promise.reject("aaa"):   将现有的东西，转成一个promise对象，reject状态，失败状态
    等价于:
    new Promise((resolve, reject) =>{
        reject("aaa")
    });

√    Promise.all([p1, p2, p3]):  把promise打包，扔到一个数组里面，打包完还是一个promise对象
    必须确保，所有的promise对象，都是resolve状态，都是成功状态
Promise.race([p1, p2, p3]): 只要有一个成功，就返回

4.2 案例：用户登录  ->  用户信息

五、模块化
JavaScript不支持模块化
    ruby   require
    python  import

在ES6之前，社区制定一套模块规范:
    Commonjs        主要服务端  nodeJs    require("http")
    AMD            requireJs, curlJs
    CMD            seaJs

ES6出来，统一服务端和客户端模块规范:
    import {xx} ffffd

5.1 模块化
注意： 需要放到服务器环境
a). 如何定义模块？
        export  东西
        export const a =12;
        export{
            a as aaa,
            b as banana
        }
        export default 12; //import a 不需要加花括号
b). 如何使用?
        import
        import "./modules/1.js"; 
        import {a as a, banana, c} from "./modules/2.js"
        import * as modTwo from "./modules/2.js";
        import a,[cc,dd} from "/.modules/3.js";
使用模块:
    


5.2 import:  特点
    a). import 可以是相对路径，也可以是绝对路径
        import "https://code.jquery.com/jquery-3.3.1.js";
    b). import模块只会导入一次，无论你引入多少次
    c). import "./modules/1.js";  如果这么用，相当于引入文件
    d). 有提升效果，import会自动提升到顶部，"首先执行"

    e). 导出去模块内容，如果里面有定时器更改，外面也会改动

5.3 import()
类似node里面require， 可以动态引入, 默认import语法不能写到if之类里面,返回值，是个promise对象。
    import("./modules/1.js").then(res=>{
        console.log(res.a+res.b);
    });  

    优点:
        1. 按需加载
        2. 可以写if中
        3. 路径也可以动态

    Promise.all([])

ES2017加  async  await:
"use strict"        以后默认就是严格模式，es6默认严格模式
完！
参考视频资料：ES6经典入门到进阶