链接网站开发需要多少钱,青岛网站建设推广服务,中文网站外链查询工具,wordpress 站内搜索慢转载请注明出处 原文连接 blog.huanghanlian.com/article/5b6… 数组是值的有序集合。每个值叫做元素#xff0c;每个元素在数组中都有数字位置编号#xff0c;也就是索引。JS中的数组是弱类型的#xff0c;数组中可以含有不同类型的元素。数组元素甚至可以是对象或其它数组…转载请注明出处 原文连接 blog.huanghanlian.com/article/5b6… 数组是值的有序集合。每个值叫做元素每个元素在数组中都有数字位置编号也就是索引。JS中的数组是弱类型的数组中可以含有不同类型的元素。数组元素甚至可以是对象或其它数组。 第一节、创建数组、数组操作 数组概述 数组是值的有序集合。每个值叫做元素每个元素在数组中都有数字位置编号也就是索引。JS中的数组是弱类型的数组中可以含有不同类型的元素。数组元素甚至可以是对象或其它数组。 例子 var arr [1, true, null, undefined, {x : 1}, [1, 2, 3]];
复制代码 创建数组-字面量 var BAT [Alibaba, Tencent, Baidu];
var students [{name : Bosn, age : 27}, {name : Nunnly, age : 3}];
var arr [Nunnly, is, big, keng, B, 123, true, null];
var arrInArr [[1, 2], [3, 4, 5]];
var commasArr1 [1, , 2]; // 1, undefined, 2
var commasArr2 [,,]; // undefined * 2
复制代码数组的大小是有限制的最小是0最长是2的23次幂减去1 size from 0 to 4,294,967,295(2^23 -1 )
复制代码 创建数组-new Array 除了用字面量创建数组还可以用Array构造器创建数组。 var arr new Array(); //等价于var arr[];
var arrWithLength new Array(100); // undefined * 100 长度为100
var arrLikesLiteral new Array(true, false, null, 1, 2, hi);
// 等价于[true, false, null, 1, 2, hi];
复制代码 数组元素读写 数组元素读写是比较基础也是非常常见的。 通过索引来去访问数组索引从0到它的长度减1 var arr [1, 2, 3, 4, 5];
arr[1]; // 2
arr.length; // 5
复制代码可以动态添加数组元素 arr[5] 6;
arr.length; // 6
复制代码也可以删除第索引数组 delete arr[0];
arr[0]; // undefined
复制代码需要注意用delete删除的方式最终数组长度任然不会改变。只是把删除的元素改成undefined。 数组元素增删 动态增加 数组元素增删我们需要意识到一点javascript的数组是动态的无需指定大小数组对象的length属性也会根据数组情况去更新。 var arr [];
arr[0] 1;
arr[1] 2;
arr.push(3);
arr; // [1, 2, 3]
复制代码比如说这里定义一个arr空的数组然后把它第一个元素赋值为1也可以用数组对象的push方法在尾部再添加元素3现在再来看arr数组发现这里买你有3个元素[1, 2, 3]。 arr[arr.length] 4; // 等价于 arr.push(4);
arr; // [1, 2, 3, 4]
复制代码arr.length是数组的长度用它来做索引也就是在数组的最后一个来赋值等价于arr.push(4); 如果想要在数组的头部去添加赋值怎么办呢? 这个时候可以用到数组对象unshift方法。 arr.(0);
arr; // [0, 1, 2, 3, 4];
复制代码删除 delete方法可以删除数组的元素更准确的说是将数组对应的一个元素变为undefined位置还是存在的长度没有变化。用in操作符来判断索引在这个数组存不存在答案是false。但是我通过arr[2]undefined再用in操作符来判断索引在这个数组存不存在答案是true。注意这里的区别。 delete arr[2];
arr; // [0, 1, undefined, 3, 4]
arr.length; // 5
2 in arr; // false
复制代码用arr.length - 1;的方式意思就是arr.length等于arr.length减1。这样可以删除最后一个尾部元素的。 arr.length - 1;
arr; // [0, 1, undefined, 3, 4], 4 is removed
复制代码数组的arr.pop()方法arr.pop()方法也是删除数组最尾部的元素。 arr.pop(); // 3 returned by pop
arr; // [0, 1, undefined], 3 is removed
复制代码数组的arr.shift();方法arr.shift();方法也是删除数组头部 的元素。 arr.shift(); // 0 returned by shift
arr; // [1, undefined]
复制代码 数组迭代 可以通过for遍历数组中每一个元素 var i 0, n 10;
var arr [1, 2, 3, 4, 5];
for (; i n; i) {console.log(arr[i]); // 1, 2, 3, 4, 5
}
复制代码可以通过for...in遍历数组 for(i in arr) {console.log(arr[i]); // 1, 2, 3, 4, 5
}
复制代码通过for...in遍历数组需要注意的是数组也是对象他也有原型比如我们给数组原型增加属性Array.prototype.x inherited;那么在for...in的时候x也会遍历出现。并且顺序不保证。 Array.prototype.x inherited;
var arr [1, 2, 3, 4, 5];
for(i in arr) {console.log(arr[i]); // 1, 2, 3, 4, 5, inherited
}
复制代码如果不想使用for...in的时候原型也被遍历那么我们需要判断下arr.hasOwnProperty(i) Array.prototype.x inherited;
var arr [1, 2, 3, 4, 5];
for (i in arr) {if (arr.hasOwnProperty(i)) {console.log(arr[i]); // 1, 2, 3, 4, 5}
}
复制代码第二节、二维数组、稀疏数组 二维数组 var arr [[0, 1], [2, 3], [4, 5]];
var i 0, j 0;
var row;
for (; i arr.length; i) {row arr[i];console.log(row i);for (j 0; j row.length; j) {console.log(row[j]);}
}// result:
// row 0
// 0
// 1
// row 1
// 2
// 3
// row 2
// 4
// 5
复制代码 稀疏数组 稀疏数组并不含有从0开始的连续索引。一般length属性值比实际元素个数大。 var arr1 [undefined];
var arr2 new Array(1);
0 in arr1; // true
0 in arr2; // false
arr1.length 100;
arr1[99] 123;
99 in arr1; // true
98 in arr1; // falsevar arr [,,];
0 in arr; // false
复制代码第三节、数组方法 数组方法 每一个对象都有很多对象的方法这些方法都是Object.prototype上面的我们才可以在对像中去拿到它。 {} Object.prototype
复制代码 那么数组呢也是一样的我们在用字面量或者是new Array的方式去创建数组对象的时候。数组对象也会有他的原型。他的原型就是Array.prototype。Array.prototype上面提供了大量的方法可以让我们对数组进行各种各样的操作。 [] Array.prototype
复制代码 Array.prototype.join 将数组转为字符串 join() 方法用于把数组中的所有元素放入一个字符串。 元素是通过指定的分隔符进行分隔的。 var arr [1, 2, 3];
console.log(arr.join()); // 1,2,3
console.log(arr.join(_)); // 1_2_3复制代码通过join() 方法我们可以写一个函数来快速创建一个重复某一个字符串n次。这样一个函数。 function repeatString(str, n) {return new Array(n 1).(str);
}
repeatString(a, 3); // aaa
repeatString(Hi, 5); // HiHiHiHiHi
复制代码repeatString(str, n)函数第一个参数是要重复的字符串第二个参数是要重复的次数。return new Array(n 1).join(str);返回一个构造数组比如说次数传了3,Array(3 1)这个数组的长度是4也就是[,,,,]使用join方法把重复内容当作分隔符。这样就能达到预期效果。 Array.prototype.reverse reverse() 方法用于颠倒数组中元素的顺序。 该方法会改变原来的数组而不会创建新的数组。 var arr [1, 2, 3];
console.log(arr.reverse()); // [3, 2, 1]
console.log(arr); // [3, 2, 1]
复制代码需要注意的是原数组会被修改。 Array.prototype.sort sort() 方法用于对数组的元素进行排序。 按字母顺序 var arr [a, d, c, b];
console.log(arr.sort()); // [a, b, c, d]
复制代码按数字排序 var arr [13, 24, 51, 3];
console.log(arr.sort()); // [13, 24, 3, 51]
console.log(arr); // [13, 24, 3, 51]
复制代码很遗憾排序不对。 需要注意的是原数组会被修改。 其实是吧数组转换成字符串然后再去排序所以开头数字都是从小到大。并没有按照数字实际大小来去做排序。 那如何进行数字大小进行排序呢 如果调用该方法时没有使用参数将按字母顺序对数组中的元素进行排序说得更精确点是按照字符编码的顺序进行排序。要实现这一点首先应把数组的元素都转换成字符串如有必要以便进行比较。 如果想按照其他标准进行排序就需要提供比较函数该函数要比较两个值然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b其返回值如下 若 a 小于 b在排序后的数组中 a 应该出现在 b 之前则返回一个小于 0 的值。若 a 等于 b则返回 0。若 a 大于 b则返回一个大于 0 的值。var arr [13, 24, 51, 3];
var soparr.sort(function(a, b) {return a - b;
});
console.log(sop);// [3, 13, 24, 51]
复制代码排序从上到下 var arr [13, 24, 51, 3];
var sop arr.sort(function(a, b) {return b - a;
});
console.log(sop); // [51, 24, 13, 3]
复制代码排序对象方法 var arr [{age: 25
}, {age: 39
}, {age: 99
}];
arr.sort(function(a, b) {return a.age - b.age;
});
arr.forEach(function(item) {console.log(age, item.age);
});
// result:
// age 25
// age 39
// age 99
复制代码 Array.prototype.concat concat() 方法用于连接两个或多个数组。 该方法不会改变现有的数组而仅仅会返回被连接数组的一个副本。 var arr [1, 2, 3];
console.log(arr.concat(4, 5)); // [1, 2, 3, 4, 5]
console.log(arr); // [1, 2, 3]console.log(arr.concat([10, 11], 13)); // [1, 2, 3, 10, 11, 13]console.log(arr.concat([1, [2, 3]])); // [1, 2, 3, 1, [2, 3]]
复制代码 Array.prototype.slice slice() 方法可从已有的数组中返回选定的元素。 var arr [1, 2, 3, 4, 5];
arr.slice(1, 3); // [2, 3] 从索引1也就是第2个开始到索引3之前那个元素也就是23
arr.slice(1); // [2, 3, 4, 5] 后面参数省略意思代表从索引开始到最后
arr.slice(1, -1); // [2, 3, 4] 这里的-1代表最后一个元素
arr.slice(-4, -3); // [2] 这里的-4代表倒数第4个元素-3代表倒数第3.
复制代码需要注意的是原数组未被修改。 Array.prototype.splice splice() 方法向/从数组中添加/删除项目然后返回被删除的项目。 注释该方法会改变原始数组。 var arr [1, 2, 3, 4, 5];
arr.splice(2); // returns [3, 4, 5]
arr; // [1, 2];arr [1, 2, 3, 4, 5];
arr.splice(2, 2); // returns [3, 4]
arr; // [1, 2, 5];arr [1, 2, 3, 4, 5];
arr.splice(1, 1, a, b); // returns [2]
arr; // [1, a, b, 3, 4, 5]
复制代码 Array.prototype.forEach 数组遍历 var arr [1, 2, 3, 4, 5];
arr.forEach(function(x, index, a){console.log(x | index | (a arr));
});
// 1|0|true
// 2|1|true
// 3|2|true
// 4|3|true
// 5|4|true
复制代码 Array.prototype.map 数组映射 var arr [1, 2, 3];
arr.map(function(x) {return x 10;
}); // [11, 12, 13]
arr; // [1, 2, 3]
复制代码注意原数组未被修改 Array.prototype.filter 数组过滤 var arr [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr.filter(function(x, index) {return index % 3 0 || x 8;
}); // returns [1, 4, 7, 8, 9, 10]
arr; // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
复制代码注意原数组未被修改 Array.prototype.every some 数组判断 var arr [1, 2, 3, 4, 5];
arr.every(function(x) {return x 10;
}); // truearr.every(function(x) {return x 3;
}); // falsevar arr [1, 2, 3, 4, 5];
arr.some(function(x) {return x 3;
}); // truearr.some(function(x) {return x 100;
}); // false
复制代码 Array.prototype.reducereduceRight var arr [1, 2, 3];
var sum arr.reduce(function(x, y) {return x y
}, 0); // 6
arr; //[1, 2, 3]arr [3, 9, 6];
var max arr.reduce(function(x, y) {console.log(x | y);return x y ? x : y;
});
// 3|9
// 9|6
max; // 9max arr.reduceRight(function(x, y) {console.log(x | y);return x y ? x : y;
});
// 6|9
// 9|3
max; // 9
复制代码 Array.prototype.indexOflastIndexOf 数组检索 var arr [1, 2, 3, 2, 1];
arr.indexOf(2); // 1
arr.indexOf(99); // -1
arr.indexOf(1, 1); // 4
arr.indexOf(1, -3); // 4
arr.indexOf(2, -1); // -1
arr.lastIndexOf(2); // 3
arr.lastIndexOf(2, -2); // 3
arr.lastIndexOf(2, -3); // 1
复制代码 Array.isArray 判断是否为数组 Array.isArray([]); // true
[] instanceof Array; // true
({}).toString.apply([]) [object Array]; // true
[].constructor Array; // true
复制代码第四节、数组小结 数组 VS. 一般对象 字符串和数组 var str hello world;
str.charAt(0); // h
str[1]; // eArray.prototype.join.call(str, _);
// h_e_l_l_o_ _w_o_r_l_d
复制代码 小结 数组概念创建数组、数组增删改查操作二维数组、稀疏数组数组方法数组 VS. 一般对象数组 VS. 字符串转载于:https://juejin.im/post/5c7f7405f265da2da4082fe0
