初学JavaScript之数组练习笔记

"数组遍历==============".description();
Array.prototype.name = "Array";
var arr3 = [1,2,3,4,5,6,7,8,9,0];
for(var i in arr3)
{
    arr3[i].description();
}
"--------".description();
for(var i in arr3)
{
    if (! arr3.hasOwnProperty(i)) continue;//跳过继承的属性
    arr3[i].description();
}

"--------".description();

arr3.forEach(function(){
    arguments.description();
})


"多维数组==============".description();
var table = new Array(10);
for (var i = 0; i < table.length; i++) {
    table[i] = new Array(10);
}
for(var row = 0; row < table.length; row++)
{
    for (var col = 0; col < table[row].length; col++) {
        table[row][col] = row * col;
    }

}   
table.description();
table[2].description();
table[2][8].description();

"数组方法==============".description();
/**
// join() 将所有元素拼接成字符串
**/
"----------join".description();
table.join("").description();
table.join("******").description();
table.description();

/**
// reverse() 将数组中的元素颠倒顺序，返回逆序的数组。
**/
"----------reverse".description();
var mArr = [1,2,3,4,5];
mArr.reverse().description();
mArr.description();

/**
// sort() 将数组中的元素排序并返回排序后的数组。当没有参数的时候，按照ASCII表排序
**/
"----------sort".description();
var mArr = new Array("aadf","Basd","Adfd","Casdf","cads","123");
mArr.sort().description();
mArr.description();

var mArr = new Array(8,3,4,9,123,444,66,88);
mArr.sort().description();

mArr.sort(function(a,b){
    // arguments.length.description();
    return a > b;
}).description();

mArr.sort(function(a,b){
    // arguments.length.description();
    return a < b;
}).description();
// a 在 b 前面则返回小于0 ， a在b之后则返回大于0


/**
//concat 方法创建并返回一个新数组，它的元素包括调用concat()的原始数组和concat()的每个参数
**/
"----------concat".description();
var arr5 = [1,2,3,4,5];
arr5.concat(4,5,[66,88],[77,[123,456]]).description();

/**
// slice 方法返回指定数组的一个片段或者子数组。有两个参数分别是开头和结尾的位置 [star,end)
**/
"----------slice".description();
arr5.slice(1,3).description();
arr5.slice(2).description();
arr5.slice(1,-1).description();
arr5.slice(-4,-2).description();
arr5.description();

/**
// splice 是在数组中插入或删除元素的通用方法。它会修改调用的数组
// 第一个参数：指定了插入或删除的起始位置
// 第二个参数：指定了应从数组中删除的元素个数。（如果省略的话，将从起始位置到数组的所有元素都将删除）
// 返回值:由删除元素组成的数组。
**/
 "----------splice".description();
var arr6 = [1,2,3,4,5,6,7,8,9,0];
arr6.splice(4).description()  // 删除 [4,end]
arr6.description();
"--".description();
var arr6 = [1,2,3,4,5,6,7,8,9,0];
arr6.splice(2,4).description();
arr6.description();
"--".description();
var arr6 = [1,2,3,4,5,6,7,8,9,0];
arr6.splice(1,1).description();
arr6.description();
"--".description();
var arr6 = [1,2,3,4,5,6,7,8,9,0];
arr6.splice(2,0,['a','b']).description();// 在小标为2的地方插入一个数组元素
arr6.description();
"--".description();
var arr6 = [1,2,3,4,5,6,7,8,9,0];
arr6.splice(2,2,'a','b').description();// 删除下标2、3，然后在下标2的位置插入两个元素
arr6.description();

/**
// push() 和 pop()
// 这两个方法允许将数组当做栈来使用。push()在尾部添加一个或多个元素，返回数组长度
// pop()删除数组的最后一个元素，长度减一，返回删除的元素
**/
 "---------- push() 和 pop()".description();
 var stack = [];
 stack.push(1,2,6).description();    // [Number: 3]
 stack.description();                // [ 1, 2 ,6]
 stack.pop().description();          // [Number: 6]
 stack.push(8,9);                    
 stack.push([11,22,33]);             
 stack.push();
 stack.description();                // [ 1, 2, 8, 9, [ 11, 22, 33 ] ]
 stack.length.description();         // [Number: 5]
 stack.pop().description();          // [ 11, 22, 33 ]
 stack.description();                // [ 1, 2, 8, 9 ]


/**
// unshift() 和 shift()
// unshift()在头部添加一个或多个元素，并将已存在的元素移动到更高索引的位置来获得足够的空间，最后返回数组长度。
// shift()删除数组的第一个元素并将其返回，其他元素前移，长度减一
// 注意：unshift()参数是一次性插入的，
**/
 "---------- unshift() 和 shift()".description();
 var mArray = [];
 mArray.unshift(1).description();                  // [Number: 1]
 mArray.unshift(22);
 mArray.description();                             // [ 22, 1 ]
 mArray.length.description();                      // [Number: 2]

 mArray.shift().description();                     // [Number: 22]
 mArray.description();                             // [ 1 ]
 mArray.length.description();                      // [Number: 1]
 mArray.unshift(88,['a','b']).description();       // [Number: 3]
 mArray.description();                             // [ 88, [ 'a', 'b' ], 1 ]



/**
// toString() 方法将数组每个元素转化成字符串并且输出用都好分割的字符串列表。
// toLocaleString()是toString()方法的本地化版本。
**/
 "---------- toString() 和 toLocaleString()".description();             
[1,2,3,4,5].toString().description();                          //[String: '1,2,3,4,5']
["a","b","c"].toString().description();                        //[String: 'a,b,c']
[1,2,3,'a','b','c'].toString().description();                  //[String: '1,2,3,a,b,c']
[1,2,[88,99],['a','c'],[666,'520']].toString().description();  //[String: '1,2,88,99,a,c,666,520']


/**
 *  map()方法将调用的数组的每个元素传递给指定的函数，并返回一个数组，它包含该函数的返回值。
 */
"---------- map()".description();  
var array1 = [1,2,3,4];
var array2 = array1.map(function(value,index,array){
    return value * value;
}) 
array2.description();  //[ 1, 4, 9, 16 ]

var array3 = array1.map(function(){
}) 
array3.description();  //[ undefined, undefined, undefined, undefined ]


/**
 * filter() 方法返回的数组元素是调用的数组的一个子集。
 * 传递的函数是用来逻辑判定的，该函数返回true/false.(返回是true代表是这个子集的成员)
 * 注意： filer()会跳过稀疏数组中缺少的元素，它的返回数组总是稠密的。
 */
"---------- filter()".description(); 
var array2 = [9,8,7,6,5,4,3,2,1,0];
var subArr = array2.filter(function(value){
    return !(value % 2);
})
subArr.description();           // [ 8, 6, 4, 2, 0 ]
array2.description();           // [ 9, 8, 7, 6, 5, 4, 3, 2, 1, 0 ]
// 这里可以压缩稀疏数组的空缺
var sparse = new Array(3);
sparse[0] = sparse[2] = "lalal";
sparse.description();           // [ 'lalal', <1 empty item>, 'lalal' ]
var dense = sparse.filter(function(){return true;});
dense.description();            // [ 'lalal', 'lalal' ]


/**
 * every() 和 some()方法是数组的逻辑判定：它们对数组元素应用指定的函数进行判定,返回ture或false
 * every() 当数组中所有元素都为true 的时候 返回才为true
 * some() 数组中至少有一个元素返回为true 就返回为ture
 */
"---------- every() 和 some()".description()
var array3 = [1,2,3,4,5,6,7,8,9];
array3.every(function(value){ return value < 10}).description(); // [Boolean: true]
array3.every(function(value){ return value < 5}).description();  // [Boolean: false]

array3.some(function(value){ return value > 10}).description();  // [Boolean: false]
array3.some(function(value){ return value > 5}).description();   // [Boolean: true]


/**
 * reduce() 和 reduceRight() 方法使用指定的函数将数组元素进行组合，生成单个值。
 * 在函数式编程中是常见的操作，也可以成为 "注入" 和 "折叠"。
 *
 * reduce 两个参数，第一个参数是简化操作的函数，第二个参数是初始值（如没有指定，默认值是数组第一个数）。
 * 操作函数的参数，第一个为初始值，接下来就是  value 、index array。
 * 这个初始值 第一次调用的时候就是 reduce()的第二个参数，第二次就是操作函数返回的值
 *
 * reduceRight() 和 reduce原理一样，只是他按照数组索引从高到低。
 */
"---------- reduce() 和 reduceRight()".description()
var array4 = [1,2,3,4,5,6,7,8,9];
// 求和
var sum = array4.reduce(function(initNumb,value,index,array){
    return initNumb + value;
},0);
sum.description();      // [Number: 45]
// 求积
var product = array4.reduce(function(initNumb,value,index,array){
    return initNumb * value;
},1);
product.description();  // [Number: 362880]
// 找出最大值
var max = array4.reduce(function(initNumb,value,index,array){
    return (initNumb > value) ? initNumb : value;
},0);
max.description();      // [Number: 9]

// 默认初始值为 9 （因为数组索引最高值为9）
var max = array4.reduceRight(function(){
    let initNumb = arguments[0];
    let value =arguments[1];
    return (initNumb > value) ? initNumb : value;
});
max.description();      // [Number: 9]

// union()函数，它计算两个对象的"并集"，返回另一个新对象，新对象具备两者的属性
var objects = [{x:1},{y:2},{z:3}];
var merged = objects.reduce(union);
merged.description();   //{ x: 1, description: [Function], y: 2, z: 3 } //忽略description属性

/**
 * 把p中的可枚举属性复制到o中，并返回o
 * 如果o和p含有同名属性，则覆盖o中的属性
 * 这个函数并不处理getter和setter以及赋值属性
 */
function extend(o,p)
{
    for(prop in p)
    {
        o[prop] = p[prop];
    }
    return o;
}
/**
 * 返回一个新对象，这个对象同事拥有o和p的属性
 * 如果o和p中有重名属性，使用p中的属性值
 */
function union(o,p){return extend(extend({},o),p);}

var objects = [{x:1,a:1},{y:2,a:2},{z:3,a:3}];
objects.reduce(union).description();       //{ x: 1, a: 3, description: [Function], y: 2, z: 3 }  //忽略description属性
objects.reduceRight(union).description();  //{ z: 3, a: 1, description: [Function], y: 2, x: 1 }  //忽略description属性


/**
 * indexOf()和 lastIndexOf()搜索整个数组中具有给定的元素，返回找到的第一个索引（如果没有返回-1）
 * indexOf() 从头到尾搜索
 * lastIndexOf() 从尾到头搜索。（我理解的是最后一个给定元素的索引）
 *
 * 第一个参数是需要搜索的值，第二个参数是可选的：从哪个索引开始搜索，如果省略就从头开始
 */
"---------- indexOf() 和 lastIndexOf()".description()
var a = [0,1,2,0,3,4,6];
a.indexOf(2).description();          // [Number: 2]
a.lastIndexOf(4).description();      // [Number: 5]
a.indexOf(9).description();          // [Number: -1]
a.indexOf(0,2).description();        // [Number: 3]
/**
 * 找出数组中所有出现的指定元素的索引
 */
var b = [1,2,3,1,3,5,6,7,3,45,7,2,3,4,6,1,2,4,1];
function findall(array,x)
{
    var result = [],
        len = array.length;
        pos = 0;
    while(pos < len){
        pos = array.indexOf(x,pos);
        if (pos === -1) break;
        result.push(pos);
        pos++;
    }
    return result;
}
findall(b,1).description();   // [ 0, 3, 15, 18 ]



"数组类型==============".description();
// 判断一个对象是否是数组
Array.isArray([]).description();   // [Boolean: true]
Array.isArray({}).description();   // [Boolean: false]

"类数组对象==============".description();
var a = {};
var i = 0;
while(i < 10){
    a[i] = i * i;
    ++i;
}
a.length = i;
// 现在当做真正的数组遍历它
var total = 0;
for(var j = 0; j< a.length; j++) total += a[j];
total.description();

a.description();
//我们可以使用Function.call方法来调用
Array.prototype.join.call(a,"+").description(); // [String: '0+1+4+9+16+25+36+49+64+81']
//返回一个真正的数组
Array.prototype.slice.call(a,0).description();  // [ 0, 1, 4, 9, 16, 25, 36, 49, 64, 81 ]
Array.prototype.map.call(a,function(value){
    return value * 10;
}).description();                               //[ 0, 10, 40, 90, 160, 250, 360, 490, 640, 810 ]

/**
 * 在一些浏览器中 它们在构造函数上直接定义函数，方便使用。例如：Array.join()
 * 为了保证使用这些函数之前是存在的 可以做如下操作
 */
Array.join = Array.join || function(array,sep){
    return Array.prototype.join.call(array,sep);
}


"作为数组的字符串==============".description();
var str = "test";
str.charAt(0).description();
str.charAt(2).description();
str[1].description();