思考题 一维数组深复制
13 May 2016

jansesun原创,转载请注明出处

之前在UESTC前端群里跟一些朋友分享了一些javascript的思考题,旨在促进群内技术讨论,共同进步。期间不乏思维的火花,一直想将这些宝贵的财富沉淀下来,以便日后翻阅。

今天群里的小伙伴无意间提起这件一直被我搁置的事情,今天决定将其付诸实践。

一维数组的深复制是一个平时项目实践中都可能会用到的,但是如果用尽可能多的方式实现这一操作呢?有多少种呢?

这里会列举一些比较精简的方式,如果读者收到一些启示,那我将不甚荣幸。

方案一 利用数组的slice操作

var cloneArray = function(arr) {
	return arr.slice(0);
};

方案二 利用数组的concat操作

var cloneArray = function(arr) {
	return [].concat(arr);
};

方案三 利用数组的splice操作

var cloneArray = function(arr) {
	return arr.splice(0, arr.length);
};

方案四 利用JSON的解析互逆操作

var cloneArray = function(arr) {
	return JSON.parse(JSON.stringify(arr));
};

方案五 利用数组的filter操作

var cloneArray = function(arr) {
	return arr.filter(function(val) {
		return true;
	});
};

方案六 利用数组的map操作

var cloneArray = function(arr) {
	return arr.map(function(val) {
		return val;
	});
};

方案七 利用EcmaScript6的数组可变参数的构造函数

var cloneArray = function(arr) {
	return arr.length === 1 ? [arr[0]] : Array(...arr);
};

方案八 利用解构数组

var cloneArray = function(arr) {
	return [...arr];
};

方案九 利用Array.of

var cloneArray = function(arr) {
	return Array.of(...arr);
};

方案十 利用Array.from

var cloneArray = function(arr) {
	return Array.from(arr);
};

以上列举了十种不同的方案,每个方案各有利弊,如果有不理解的api可以参看MDN或者DevDocs,相信你会有不一样的收获。