ES6中关于数组 的新增特性

ES6中关于数组 的新增特性

基础部分：

<script>
    // slice 截取(可以实现复制)
    /*
    let names = [1, 2, 3, 4, 5, 6];
    // let names2 = names.slice();     // Copy
    let names2 = names.slice(1, 3);
    console.log(names2);               // [ 2, 3 ]
    */

    // concat 拼接
    /*
    let names = [1, 2, 3, 4, 5, 6];
    let names2 = [7, 8];

    // names = names.concat(names2);

    names = [...names, ...names2];

    console.log(names);
    */

    // fill 填充
    /*
    let names = new Array(10);

    // names.fill(0);
    // names.fill(0, 0, 3);     // 填充索引0，1，2这三个元素的值为0
    names.fill(0, 2, 5);        // 填充索引2，3，4这三个元素的值为0

    console.log(names);
    */

    // splice 剔除
    /*
    let names = [1, 2, 3, 4, 5, 6];

    // 占位（数组长度不变）
    // delete names[2];

    // 剔除（数组长度减少）
    names.splice(2, 1);

    console.log(names);
    */

    /*
    // indexOf  返回含有元素的索引
    let names = [1, 2, 3, 4, 5, 6, NaN];
    // console.log(names.indexOf(3));  // 2
    // console.log(names.indexOf(30));  // -1
    console.log(names.indexOf(NaN));    // -1(无法判断NaN)

    // includes 如果包含就返回true，否则为false
    // console.log(names.includes(30));
    console.log(names.includes(NaN));       // true
    */

    // 下面三个方法，是Array, Set, Map这三种数据结构都有的！
    // 返回Iterator遍历器对象！
    // 这个Inerator只有一个方法——next()，返回下一个元素！
    // keys
    // values
    // entries

    let names = [11, 22, 33];
    // console.log(names.keys());
    // 返回 索引 集
    // let it = names.keys();
    /*
    console.log(it.next());
    console.log(it.next());
    console.log(it.next());
    console.log(it.next());
    */
    /*
    let item = it.next();
    while (!item.done) {
        console.log(item.value);
        item = it.next();
    }
    */

    // console.log(names.values());
    // 返回 值 集
    // let it = names.values();
    /*
    console.log(it.next());
    console.log(it.next());
    console.log(it.next());
    console.log(it.next());
    */
    /*
    let item = it.next();
    while (!item.done) {
        console.log(item.value);
        item = it.next();
    }
    */

    // 返回 索引-值（键值数组）集
    let it = names.entries();
    // console.log(it);
    /*
    console.log(it.next());
    console.log(it.next());
    console.log(it.next());
    console.log(it.next());
    */
    /*
    let { value: [index, value], done } = it.next();
    console.log(index, value);
    console.log(done);
    */
    
    /*
    try {
        var { value: [index, value], done } = it.next();
        while (!done) {
            console.log(index, value);
            var { value: [index, value], done } = it.next();
        }
    } catch(e) { }
    */
    
</script>

数组的循环遍历：

<script>
    let names = [11, 22, 33, 44];

    // 要循环一个数组，可以采用如下几种方式：
    // 1、keys

    // 2、values

    // 3、entries

    // 4、索引循环（计数器循环）
    // for (let i = 0, len = names.length; i < len; i++)
    //     console.log(i, names[i]);

    // 5、for-in（索引是＊＊＊字符串＊＊＊）
    for (let i in names) {
        console.log(typeof i, i, names[i]);
        if (i == 2)
            break;
    }

    // 6、for-of（值循环）
    // for (let v of names) {
    //     console.log(v);
    //     if (v == 22)
    //         break;
    // }

    // 7、forEach（数组的回调方法，不能被break）
    // names.forEach(function(v, i) {
    //     console.log(i, v);
    //     if (i == 2)
    //         break;              // ERROR
    // });
</script>

回调：

<script>
    // 数组中新增的回调

    // forEach
    // sort


    // map 将数组中的每一个元素进行逐一处理，然后返回处理后的结果数组（如果是对象数组还是原元素的引用关系，如果是值数组，处理完后返回新的数组）
    /*
    let scores = [50, 60, 77, 30];
    let scores2 = scores.map(function(item, index) {
        return Number.parseFloat((Math.sqrt(item) * 10).toFixed(1));
    });

    console.dir(scores2);
    console.dir(scores);
    */

    let students = [
        { id: 1, name: "Tom", score: 60},
        { id: 2, name: "Sam", score: 60},
        { id: 3, name: "Ben", score: 77},
        { id: 4, name: "Frank", score: 69}
    ];
    /*

    let students2 = students.map(function(student) {
        student.score = Number.parseFloat((Math.sqrt(student.score) * 10).toFixed(1));
        return student;
    });

    console.dir(students2);
    console.dir(students);
    */

    // find 返回查找匹配的第一个元素即可（找不到返回undefined）
    /*
    let student = students.find(function(student) {
        console.log("pp");
        return student.score == 100;
        // return student.score >= 60;
    });

    console.log(student);
    */

    // findIndex 返回查找匹配的第一个元素索引即可（找不到返回-1）
    /*
    let index = students.findIndex(function(student) {
        console.log("pp");
        // return student.score == 100;
        return student.score >= 60;
    });

    console.log(index);
    */

    // filter 过滤出数组中满足条件的所有元素，以结果数组返回（如果是对象数组还是原元素的引用关系，如果是值数组，处理完后返回新的数组）
    // let scores = [50, 60, 77, 30];
    // let scores2 = scores.filter(function(item, index) {
    //     return item >= 60;
    // });
    // console.dir(scores2);
    // console.dir(scores);

    /*
    let students2 = students.filter(function(student) {
        return student.score >= 60;
    });

    console.log(students2);
    console.log(students);

    console.log(students2[0] === students[1]);
    */

    // every 如果数组中的每个元素都满足条件，那么才返回真，只要有一个元素不满足条件就返回假
    /*
    let flag = students.every(function(student) {
        console.log("pp");
        return student.score >= 60;
    });

    console.log(flag);
    */

    // some 只要数组中有一个元素满足条件，就返回真（只有都不满足，才返回假）
    let flag = students.some(function(student) {
        console.log("pp");
        return student.score < 60;
    });

    console.log(flag);
</script>