JavaScript数组特性与实践应用深入详解

JavaScript 提供了一种类似数组特性的对象,它把数组的下标变为字符串,作为对象的属性。虽然它比一个真正的数组来的慢,但是使用起来很方便。

1 数组字面量

数组字面量是在一对方括号中包围零个或多个用逗号分隔的值的表达式:

var empty = []; var numbers = [ 'zero', 'one', 'two', 'three' ]; console.log(empty[1]);//undefined console.log(numbers[1]);//one console.log(empty.length);//0 console.log(numbers.length);//4

数组对象继承自 Array.prototype,所以 numbers 继承了大量有用的方法。

JavaScript 允许数组包含任意混合类型的值:

var misc = [ 'string', 11.3, false, true, null, undefined, ['nested', 'array'], {object: true}, NaN, Infinity ]; console.log(misc.length);//10

2 长度

数组有一个 length 属性,但它是没有上界的。如果用大等于当前 length 的数字作为下标来存储元素,那么 length 属性值会被增大以便容纳新的元素,而不会发生数组越界现象哦O(∩_∩)O~

length 属性的值很诡异,它是数组最大整数属性名加 1,即它不一定等于数组的元素个数:

var myArray = []; console.log(myArray.length);//0 //myArray 只包含一个属性,但 length 的值等于这个数组最大整数的属性名加 1 myArray[100000] = true; console.log(myArray.length);//100001

[] 后置运算符会把它包含的表达式转换为字符串,如果表达式有 toString() 方法,那么就会调用它。这个字符串被当做属性名,如果这个字符串是一个大等于当前 length 值而且小于 4294967295 的正整数,那么这个数组的 length 就会被重置为新的下标加 1。

可以直接设置 length 的值。设置更大的 length 值不会为数组分配更多的空间;而把 length 设小则会导致所有下标大等于新的 length 的属性被删除:

//删除元素 numbers.length = 3; console.log(numbers);//[ "zero", "one", "two" ]

把下标指定为数组的当前 length,就可以把一个新元素附加到数组的尾部:

//新增元素 numbers[numbers.length] = 'four'; console.log(numbers);//[ "zero", "one", "two", "four" ]

使用 push() 可以更方便地实现同样的功能:

//新增元素(push) numbers.push('good'); console.log(numbers);//[ "zero", "one", "two", "four", "good" ]

3 删除

JavaScript 数组就是对象,所以可以用 delete 移除元素:

delete numbers[2]; console.log(numbers);//[ "zero", "one", <1 个空的存储位置>, "four", "good" ]

可惜的是,这会在数组中留下一个空洞!而我们希望的是:删除后,被删除元素的后续元素会自动地往前移动。

JavaScript 数组提供了 splice() 方法,它接受下列参数:
①. 数组的索引。
②. 要删除的元素个数。
③. 其他参数(多个)- 把这些参数依次插入到索引位置。

//第一个参数是索引号,第二个参数是要删除的元素个数 numbers.splice(2, 1); console.log(numbers);// [ "zero", "one", "four", "good" ]

4 枚举

JavaScript 数组是对象,所以可以用 for in 语句来遍历数组的所有属性。可是 for in 语句无法保证属性的顺序,而且可能从原型链中得到意外的属性。

可以使用 for 来避免上述的问题:

var i, myArray = numbers; for (i = 0; i < myArray.length; i += 1) { console.log(myArray[i]); }

5 数组与对象

如何在这两者进行选择?当属性名是小而连续的整数时,使用数组;否则使用对象。

JavaScript 的 typeof 会认为数组是 object,这没有意义!

我们可以定义一个函数来检测数组:

var is_array = function (value) { return value && typeof value === 'object' && value.constructor === Array; };

这个方法在不同窗口(window)或框架(frame) 里构造的数组会失败。所以请用下面的这个更好的方法:

var is_array = function (value) { return Object.prototype.toString.apply(value) === '[object Array]'; }; console.log(is_array(myArray));//true

6 方法

JavaScript 提供了一些对于数组可用的方法,它们被存储在 Array.prototype 中。我们可以为数组增加一个对数组进行计算的方法:

//新增可以对数组中的元素进行计算的方法 Array.method('reduce', function (f, value) { var i; for (i = 0; i < this.length; i += 1) { value = f(this[i], value); } return value; });

这样所有的数组都继承了这个方法。它接受一个函数与初始值为参数。然后遍历数组,并通过函数计算出新值,最后返回这个值。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/13ccdd389c0e6a75cba7870a454c5c9c.html