数组的奥妙(更新中)

1. 新建

方法一:var a = [1,2,3]; 这种方法最好,但是针对很长的数组不好实现;

方法二:new Array(LENTH) 这种方法会产生数组中的holes,可以通过fill()填充优化

var a = new Array(3); // [,,]
var a = new Array(3).fill(0); // [0,0,0]

方法三:Array.from()从array-like/iterable object中创建数组(比如把字符串’foo’变成[‘f’,‘o’,‘o’])

var a = Array.from(new Array(3)); // [undefined,undefined,undefined]
// compare
[...new Array(2)];  // [undefined, undefined]

其功能多说两句,参数为(拷贝自MDN)
arrayLike
—— An array-like or iterable object to convert to an array.
mapFnOptional
—— Map function to call on every element of the array.
thisArgOptional
—— Value to use as this when executing mapFn.
实例
Array.from([1,2,3], x => x*2); // [2,4,6] 实现了map的功能,也可以
Array.from(new Array(3), () => 0); // [0,0,0]
Array.from(new Array(3), (x,i) => i); // [0,1,2]

方法四:var a = []; for (var i=0;i<LEN;i++){a.push(0)};没有hole了,但是随着数组的增长,引擎可能多次调整数组的位置。

过程中发现了一个很有趣的东西:

[...[1,2,3]];  // [1,2,3]
{...{a:1,c:2,g:3}}  // {a:1,c:2,g:3}
[...{a:1,c:2,g:3}]  // Uncaught TypeError: object is not iterable ...

[...new Array(3).keys()]  // [ 0, 1, 2 ]

Cheat sheet: creating Arrays

Filled with holes or undefined:

new Array(3)  // [ , , ,]
Array.from(new Array(2))  // [undefined, undefined]
[...new Array(2)]  // [undefined, undefined]

Filled with arbitrary values:

const a=[]; for (let i=0; i<3; i++) a.push(0);  // [0, 0, 0]
new Array(3).fill(0)  // [0, 0, 0]
Array.from(new Array(3), () => 0)  // [0, 0, 0] (small integers)
Array.from(new Array(3), () => ({}))  // [{}, {}, {}] (unique objects)

Ranges of integers:

Array.from(new Array(3), (x, i) => i)  // [0, 1, 2]
const START=2, END=5; Array.from(new Array(END-START), (x, i) => i+START)  // [2, 3, 4]
[...new Array(3).keys()]  // [0, 1, 2]

参考@Dr. Axel Rauschmayer:http://2ality.com/2018/12/creating-arrays.html


2. 拷贝

JSON原生方法实现深拷贝

var obj1 = {a:0, b: {c:0}};
var obj2 = JSON.parse(JSON.stringify(obj1));
obj1.b.c = 3;
console.log(obj2) // {a:0, b:{c:0}}

延伸 Object.assign():

合并对象(结构比较简单,不会成为树——目标对象从哪一层指定,父就不考虑了;源对象是引用方式的深拷贝)

var a = {a:1}
var b = {b:2}
var c = {c:3}
var all = Object.assign({},a,b,c)   // {a: 1, b: 2, c: 3}
all = Object.assign(a,b,c)   // {a: 1, b: 2, c: 3}
a.a1 = {l:1}
all = Object.assign(a,b,c)   // {a: 1, b: 2, c: 3, a1: {…}}
all = Object.assign(a.a1,b,c)   // {l: 1, b: 2, c: 3}

3. 判断是否是数组

JavaScript高级程序设计(第3版):

[] instanceof Array
Array.isArray([]);
Object.prototype.toString.call([]) === '[object Array]';

第二种方法有兼容性限制

4. 排序

JavaScript高级程序设计(第3版):
sort的排序规则是自动调用数组中每个元素的toString()方法,按照字符串比较,所以在数字比较中会出现问题。

解决办法:

var a = [1,5,10,15,1];
a.sort((val1,val2) => val1-val2)

sort中传入一个比较函数,前者<后者为-1(排在前面);前者>后者为1(排在后面)

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值