javascript 中的数组

检测数组

let arr = [name,age];

console.log( arr instanceof Array );       // => true
console.log( Array.isArray(arr) );         // => true
console.log( arr.constructor === Array);   // => true


/* instanceof 操作符
 * 用于判断对象的类型，可判断 对象、数组、正则表达式、函数 
 *
 *
 * constructor 属性
 * 用于返回创建该对象的函数，也就是我们常说的构造函数
 * 用 prototype 可以重写 constructor 属性（即 consructor 属性可以改变），慎用 
 */

转换方法

let colors = ["red","blue","green"];

console.log( colors.valueOf() );   // => red,blue,green
console.log( colors.toString() );  // => red,blue,green

console.log( colors.join("") );    // => red,blue,green
console.log( colors.join("|") );   // => red|blue|green

/* valueOf() 、 toString() 、join() 方法
 * valueOf()方法、toString()方法 在默认情况下都会以逗号分隔的字符串形式返回数组项
 * join() 方法则可以使用不同的分隔符来构建这个字符串
 * join() 方法只接收一个参数，作为分隔符构建字符串，参数为空或 undefined，则使用逗号作分隔符

为数组添加新值

let colors = ["red"];

/*在数组末尾添加新项*/
colors[colors.length] = "black";      // => colors[1] = "black"
colors[colors.length] = "brown";      // => colors[2] = "brown"

colors.push("white");             
console.log(colors);                  // => ["red","black","brown","white"]

/*在数组最前添加新项*/
colors.unshift("orange","pink");
console.log(colors);                  // => ["orange","pink","red","black","brown","white"]

/*在任意地方插入新项*/
colors.splice(2,0,"blue");            //从位置2开始插入一项
console.log(colors);                  //=>["orange","pink","red","blue","black","brown","white"]

/*删除任意项并添加新项（替换）*/
colors.splice(2,2,"green","yellow");  //从位置2开始删除两项，再插入两项
console.log(colors);                  //=>["orange","pink","green","yellow","black","brown","white"]

/*重新创建一个新数组*/
let newArr_one = colors.concat("blue");
let newArr_two = ['purple'].concat(colors);
console.log(newArr_one);              //=>["orange","pink","green","yellow","black","brown","white","blue"]
console.log(newArr_two);              //=>["purple","orange","pink","green","yellow","black","brown","white"]


/* 每当使用 colors.lenghth 在数组末尾添加新项之后，其 length 属性都会自动更新以反应这一变化
 * 使用 colors.lenghth 在数组末尾添加新项，比使用 push() 方法性能更优
 * push() 方法可向数组末尾添加一项或多项元素
 *
 * unshift() 方法可在数组前端添加任意个项并返回新的数组长度
 *
 * splice() 方法可以向指定位置插入任意数量的项
 * splice() 方法需要提供3个参数：起始位置、0（要删除的项数）、要插入的项
 * 如果要插入多个项，可以再传入更多项，如：colors.splice(2,0,"blue"，"green");
 * 
 * concat() 方法会创建当前数组的一个副本，然后讲接收到的参数添加到副本末尾
 * concat() 方法再没有参数传递的情况下，只是复制当前数组并返回副本
 * concat() 方法的参数如果是一或多个数组，则该方法会将这些数组中的每一项都添加到结果数组中
 * concat() 方法的参数如果不是数组，这些值就会被简单地添加到数组的末尾
 */

删除数组中的元素

let colors = ["orange","pink","green","yellow","black","brown","white"];

/*删除数组前端的项*/
let item_one = colors.shift();    
console.log(item_one);     // => "orange"
console.log(colors);       // => ["pink","green","yellow","black","brown","white"]

/*删除数组末尾的项*/
let item_two = colors.pop();    
console.log(item_two);     // => "white"
console.log(colors);       // => ["pink","green","yellow","black","brown"]

/*删除数组任意位置的任意项*/
colors.splice(0,2)  
console.log(colors);       // => ["yellow","black","brown"]

/*重新创建一个新数组*/
let colors_two = ["orange","pink","green","yellow","black","brown","white"];
let colors_three = colors_two.slice(2);
let colors_four = colors_two.slice(2,5);
console.log(colors_three); // => ["green","yellow","black","brown","white"];
consolo.log(colors_four);  // => ["green","yellow","black"];


/* shift() 方法可以移除数组中的第一个项并返回该项
 *
 * pop() 方法可以移除数组中的最后一项并返回该项
 *
 * splice() 方法可以删除任意数量的项，需指定两个参数：要删除的第一项位置和要删除的项数
 *
 * slice() 方法能够基于当前数组中的一个或多个项创建一个新数组
 * slice() 方法可以接受一个或两个参数，即返回项的起始位置和结束位置
 * slice() 方法在只有一个参数的情况下，返回从该参数指定位置开始到当前数组末尾的所有项
 * slice() 方法如果有两个参数，则返回起始和结束位置之间的项----但不包括结束位置的项
 */

迭代方法

let numbers = [1,2,3,4,5,4,3,2,1];

let everyResult = numbers.every(function(item, index, array){
    return (item > 2);
})
let someResult = numbers.some(function(item, index ,array){
    return (item > 2);
})
let filterResult = numbers.filter(function(item, index ,array){
    return (item > 2);
})
let mapResult = numbers.map(function(item, index ,array){
    return item * 2;
})
numbers.forEach(function(){
    //执行某些操作
})

console.log(everyResult);     // => false
console.log(someResult);      // => true
console.log(filterResult);    // => [3, 4, 5, 4, 3]
console.log(mapResult);       // => [2, 4, 6, 8, 10, 8, 6, 4, 2]

/* every()、filter()、forEach()、map()、some() 统称迭代方法
 * 传入迭代方法中的函数会接受三个参数：数组项的值、该项在数组中的位置、数组对象本身
 * 
 * every()：对数组中的每一项运行给定函数，如果该函数对每一项都返回 true, 则返回 true 
 * some()：对数组中的每一项运行给定函数，如果该函数对任一项返回 true, 则返回 true
 * filter()：对数组中的每一项运行给定函数，返回该函数会返回 true 的项组成的数组
 * map()：对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组
 * forEach()：对数组中的每一项运行给定函数，这个方法没有返回值
 */

reduce()

let numbers = [1,2,3,4,5];

let reducer = function add(sumSoFar, item){
    return sumSoFar + item;
}

let res_one = numbers.reduce(function(prev, cur, index, array){
    return prev + cur;
})

let res_two = numbers.reduce(reducer,10);

console.log(res_one);                           // => 15
console.log(res_two);                           // => 25


/* reduce() 方法接收一个函数作为累加器（accumulator），数组中的每个值（从左到右）开始缩减，最终 
 * 为一个值。
 *
 * reduce 为数组中的每一个元素依次执行回调函数，不包括数组中被删除或从未被赋值的元素，接受四个参
 * 数：初始值（或者上一次回调函数的返回值），当前元素值，当前索引（可选），调用 reduce 的数组（可 
 * 选）
 *
 * reduce(callback,initiaValue) 会传入两个变量，回调函数 (callback) 和初始值 (initiaValue)。
 * 当没有传入初始值时，prev是从数组中第一个元素开始的，cur是第二个函数。
 * 但是当传入初始值（initiaValue）后,第一个prev将是initivalValue，cur将是数组中的第一个元素。
 */