Javascript数组Array基础介绍_基础知识

WBOY
Release: 2016-05-16 15:10:51
Original
1067 people have browsed it

Javascript,一门神奇的语言,它的数组也同样独特。我们要去其糟粕,取其精华,把常用的最优实践总结出来。如有错误,请指出。

javascript数组是一种类数组的对象,拥有对象的特性。当属性名是小而连续的整数时,应该使用数组,否则,使用对象。

数组来源

所有的数组都是Array构造出来的,我们来测试一下constructor这个属性。

var arr = []; arr.constructor === Array; // true arr.constructor === Array.prototype.constructor; // true
Copy after login

创建数组

//数组字面量方式 var arr1 = [1, 2, 3]; // [1,2,3] //构造函数方式 var arr2 = new Array(); // [] 空数组 var arr3 = new Array('9'); // ["9"] 一个字符串元素 var arr4 = new Array(9); // [] 数组长度length为9 var arr5 = new Array([9]); // [[9]] 相当于二维数组 var arr6 = new Array(1, 2, 3); // [1, 2, 3] var arr7 = new Array(1, function f(){}, {o : 6}, null,undefined,true); // 数组可以存储任意混合数据类型
Copy after login

由于arr4的方式,当只有一个数字参数传递到Array的构造函数中,构造函数会返回设置了length属性的空数组。所以推荐使用数组字面量方式,短小而简洁。

检测对象是否为数组

var arr1 = [1, 2, 3]; typeof(arr1); // object
Copy after login

众所周知,typeof不能正确检测类型。

arr1 instanceof Array; //true
Copy after login

instanceof 方式在一个网页内是没有问题,一旦嵌套其他网页,便存在两个全局作用域,互相调用时的检测就会出问题。

Array.isArray(arr1); // true
Copy after login

Array.isArray() 是ECMAScript5 新增的方法,没有缺陷。唯一的问题是ie8浏览器不支持,ie9浏览器在严格模式下也不支持。

Object.prototype.toString.apply(arr1).slice(8, -1); // Array
Copy after login

最后一种方式是检测类型的最好方法。

数组长度

数组的length也是它的属性,增大length也不会发生越界错误。
length值等于数组最大的整数属性名加1。

var arr1 = []; arr1[9] = 1; // 长度为10,只包含一个元素的数组
Copy after login

设小值将将会把属性名大于等于length的属性删除。
如果将length值设为0,相当于清空数组。

var arr2 = [1, 2, 3, 4, 5]; arr2.length = 3; // [1, 2, 3] arr2.length = 0; // []
Copy after login

数组遍历

遍历数组不要使用for in循环遍历数组,因为for in会遍历原型链上的所有属性,但我们并不需要这么多。推荐使用for循环的方式。

var arr1 = [1, 2, 3]; arr1.test = 9; //for in 方式 for(var prop in arr1){ cosole.log(prop, arr1[prop]); } // 输出如下 // 0 1 // 1 2 // 2 3 // test 9 //for循环方式 for(var i = 0, len = arr1.length; i < len; i++){ console.log(arr1[i]); } //输出如下 // 1 // 2 // 3
Copy after login

我们看到for in方式多出了一个test值,可以使用hasOwnProperty函数排除,但那会比for循环的方式慢很多。
缓存数组长度很有必要的一步,每次访问是有性能开销的(最新的浏览器在这方面做了优化)。

小结

简单介绍了Array的相关基础知识,到这里也算是能对Array有更全面的理解了。下一篇介绍Array的方法。

Javascript虽然有很多不太容易弄懂的地方,随着长时间的学习,我已经慢慢地爱上它了(因为现在没有妹子让我爱)。

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!