连接数组、字符串方法总结

来源:互联网 发布:im聊天软件蓝色 编辑:程序博客网 时间:2024/05/29 18:22

一、 连接数组

1、concat()

concat()可以基于当前数组的所有项创建一个新数组。具体来说,它会创建当前数组的一个副本,然后将接收到的参数添加到这个副本的末尾,最后返回新构建的数组。
如果传递给concat()方法的是一或多个数组,则该方法会将这些数组中的每一项添加到结果数组中。如果传递的值不是数组,这些值就会被简单地添加到结果数组末尾。

var  colors=['red','yellow','blue'];var colors2=colors.concat('yellow',['black','brown']);console.log(colors);//["red", "yellow", "blue"]console.log(colors2);//["red", "yellow", "blue", "yellow", "black", "brown"]

ps:该方法不会改变现有数组,会创建一个新数组。我们要为新创建的数组分配内存空间,为其赋值,有一点点资源的消耗。

2、[].push.apply

var arr1= [1,2,3]; arr1.push.apply(arr1,[4,5]); 

ps:巧妙的运用了apply方法的特性,这样arr1仍然是arr1,只是内存进行了重写。

二、连接字符串

字符串的特点:

ECMAScript中的字符串是不可变的,也就是说,字符串一旦创建,他们的值就不能改变。要改变某个变量的保存的的字符串,首先要销毁原来的字符串,然后再用另外一个包含新值的字符串填充该变量,例如:

1、“+”连接符

var lang = "Java";lang = lang + "Script";

ps:早期浏览器没有对这种运算进行优化。由于字符串是不可变的,这意味着要创建中间字符串来存储连接的结果。频繁地在后台创建和销毁字符串导制性能异常低下。
操作的过程:首先创建一个能容纳10个字符的新字符串,然后在这个字符串中填充“Java”和“Script”,最后一步是销毁原来的字符串“Java”和“Script”,因为这两个字符串已经没用了。但是在低版本的浏览器(如IE6)中,字符串拼接速度是很消耗一个性能的过程。

2、以数组作为中介,用join()连接数组

var arr=new Array();arr.push(a);arr.push(b);var str=arr.join("");

ps:在早期的浏览器中,没有创建和销毁中间字符串,在大量字符串连接情况下,这技术已被证明远快于使用加法方式。

3、concat()

var str1 = new String( "This is string one" );var str2 = new String( "This is string two" );var str3 = str1.concat( str2 );

ps:
如今浏览器对字符串的优化已经改变了字符串相连的局面。Safari、Opera、Chrome、Firefox和IE8都在使用加法运算符上表现出了更好的性能。但是,IE8之前的版本没有优化,因此数组方法依然有效。这并不意味着字符串相连时我们要进行浏览器检测。
在决定如何连接时要考虑的是字符串的大小和数量。
当字符串相对较小(小于20字符)且连接数量也较小时(小于1000个),所有的浏览器使用加法运算符都能在不到1毫秒内轻松完成连接。增加字符串数量或大小时,IE7中性能会明显下降。字符串大小增加时,Firefox中加法运算符和数组成技巧性能差异会变小。字符串数量增加时,Safari中加法运算符和数组成技巧性能差异会变小。改变字符串数量或大小时,Chrome和Opera中加法运算符一直保持领先优势。所以,由于在各浏览器下性能不一致,选用技术取决于实际情况和面对的浏览器。
大多数情况下,加法运算符是首选;如果用户主要使用IE6或7,并且字符串大小较大或数量较多时,那么数组技术就很值得。

一般情况下,如果是语义性的字符串,不应该使用Array,比如:

'Hello, my name is ' + name;  

如果字符串是”相似情况的重复”的话,建议使用Array,比如:

var array = []; for (i = 0; i < length; i++) { array[i] = '<li>' + list[i] + '</li'>; } document.getElementById('somewhere').innerHTML = array.join('\n');
原创粉丝点击