Detailed explanation of the new array API in ES6

This time I will bring you a detailed explanation of the new array API in ES6. What are the precautions when using the new array API in ES6? Here are practical cases, let’s take a look.

// 标准数组json格式;
var json = {
    "0": "liuliu",
    "1": 24,
    "2": true,
    "length": 3
};
var arr = Array.from(json);
console.log(arr);
//Array.of(); 说白了其实是一种构造数组的方式;
Array(1, 2, 3, 5); //[1,2,3,5]
Array.of(1, 2, 3, 5); //[1,2,3,5]
//Array(1,2,3,5); 没见过?? No.    new Array(1,2,3,5)见过吧;new可以省略;参照犀牛书;
//区别:
Array.of(3); //[3]
Array(3); //[,,];
var arr0 = Array.of(1, 2, 3, 4);
console.log(typeof arr0);
console.log(arr0);
console.log(Array(1, 2, 3));
console.log("---------------------");
//.find()方法.实例方法;  //val:值,key:索引,arr:实例本身
var arr00 = ["liuhf", 1, 4, 5];
var arr_00 = arr00.find(function(val, key, arr) {
    return key == 0; //相当于筛选;
});
console.log(typeof arr_00);
console.log(arr_00);
console.log(arr00); //不会改变原数组;
// 数组实例的fill方法; babel无法转换 IE11暂时也无法支撑;
var liu = ["liu", "hai", "oo"];
liu.fill("李", 1, 2); //1,表示替换在liu[1]的位置(起始位置) 2,表示结束位置liu[2],但是不包括2;
console.log(liu); //[ 'liu', '李', 'oo' ]
//数组遍历新方法: for of
//输出值;
for (let item of liu) {
console.log(item);
}
console.log("##############");
//输出索引;
for (let keys of liu.keys()) {
console.log(keys);
}
console.log("##############");
//输出值跟索引: entries()  IE11没办法支持[babel也转化后也不支持(主要有个Symbol)];edge浏览器可以支持(win10测试;)
 for (let [val, key] of liu.entries()) { 
　　console.log(val + ":" + key); 
} 
console.log("##############"); 
console.log(liu.entries()); 　　　　//chrome下为 Array Iterator {}; Edge下为 普通Object object{} 
console.log(liu.entries().length); //undefined //不能理解啊,数组没有长度.

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to the php Chinese website Other related articles!

Related reading:

Detailed explanation of new number judgment in ES6

Detailed explanation of string template in ES6

Detailed explanation of ES6 expansion operator

The above is the detailed content of Detailed explanation of the new array API in ES6. For more information, please follow other related articles on the PHP Chinese website!