JavaScript数组用于多个值存储在一个变量。
显示阵列
在本教程中,我们将使用脚本来显示一个数组里面<p>与元素id="demo" :
例
<p id="demo"></p>
<script>
var cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars;
</script>
第一行(脚本)创建了一个汽车阵列命名。
第二行“发现”与元素id="demo"和"displays"在阵"innerHTML"吧;
试一试
创建一个数组,并赋值给它:
空格和换行并不重要。 一个声明可以跨越多行:
不要把一个逗号的最后一个元素(如后"BMW" )。
效果是跨浏览器不一致。
什么是数组?
阵列是一个特殊的变量,其可以在一个时间持有多个值。
如果你有一个项目列表(车名的列表,例如),存储车在单变量看起来是这样的:
var car1 = "Saab";
var car2 = "Volvo";
var car3 = "BMW";
但是,如果您通过汽车要循环什么,并找到一个特定的一个? 如果你有没有3辆汽车,但300?
该解决方案是一个数组!
数组可以在一个单一的名称包含多个值,你可以通过参考索引号访问值。
创建阵列
使用数组文本是创建一个JavaScript阵列的最简单方法。
句法:
var array-name = [ item1 , item2 , ...];
例:
var cars = ["Saab", "Volvo", "BMW"];
使用JavaScript的新关键字
下面的例子还创建一个数组,并赋值给它:
上面两个例子做同样的。 没有必要使用new Array()
为了简单起见,可读性和执行速度,使用第一个(在阵列字面方法)。
访问数组的元素
你通过参照索引号指一个数组元素。
这个语句访问在汽车的第一个元素的值:
var
name = cars[0];
这个语句修改了汽车的第一个元素:
cars[0] = "Opel";
[0]是在阵列中的第一个元素。 [1]是第二。 数组索引从0开始。
您可以有不同的物体在同一阵列
的JavaScript变量可以是对象。 数组是特殊类型的对象。
正因为如此,可以在同一个阵列不同类型的变量。
您可以在一个数组对象。 您可以在阵列功能。 您可以在一个数组的数组:
myArray[0] = Date.now;
myArray[1] = myFunction;
myArray[2] = myCars;
数组是对象
阵列是一种特殊类型的对象。 该typeof在JavaScript中运算符返回"object"的阵列。
但是,JavaScript数组是最好的形容为数组。
阵列使用numbers来访问它"elements" 。 在这个例子中, person[0]返回John :
对象使用的名称来访问它的“成员”。 在这个例子中,person.firstName返回John :
阵列属性和方法
JavaScript数组的真正实力是内置阵列的属性和方法:
例子
var x = cars.length;
// The length property returns the number of elements in cars
var y = cars.sort();
// The sort() method sort cars in alphabetical order
Array方法覆盖在下一章。
length属性
的length的阵列的属性返回一个数组(数组元素的数目)的长度。
例
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.length; // the length of fruits is 4
试一试» 长度属性总是比最高数组索引多一个。
添加数组元素
一个新的元素添加到阵列的最简单方法是使用push方法:
例
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Lemon"); // adds a new element (Lemon) to fruits
试一试» 新的元素也可以加入到使用数组length属性:
例
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Lemon"; // adds a new element (Lemon) to fruits
试一试» 警告 !
添加高指标可以创建不确定因素"holes"中的数组:
例
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[10] = "Lemon"; // adds a new element (Lemon) to fruits
试一试» 循环数组元素
通过数组循环最好的方法,是用"for"循环:
例
var fruits, text, fLen, i;
fruits = ["Banana", "Orange", "Apple", "Mango"];
fLen = fruits.length;
text = "<ul>";
for (i = 0; i < fLen; i++) {
text += "<li>" + fruits[i] + "</li>";
}
试一试» 关联数组
许多编程语言都支持一个名为索引的数组。
名为索引数组称为关联数组(或哈希)。
JavaScript 不支持数组名为索引。
在JavaScript中, 数组总是使用编号的索引 。
例
var person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
var x = person.length;
// person.length will return 3
var y = person[0];
// person[0] will return "John"
试一试» 警告 !!
如果你使用了一个名为索引的JavaScript将重新定义数组一个标准的对象。
在此之后, 所有阵列的方法和属性将产生不正确的结果 。
例:
var person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
var x = person.length; // person.length will
return 0
var y = person[0];
// person[0] will return undefined
试一试» 数组和对象之间的差异
在JavaScript中, 数组使用编号的索引 。
在JavaScript中, 对象使用命名的索引 。
数组是一种特殊的对象,并编号的索引。
当使用数组。 当使用对象。
- JavaScript不支持关联数组。
- 当你想要的元素名称是字符串(文本),你应该使用对象 。
- 当你想要的元素名称是数字您应该使用数组 。
避免new Array()
有没有必要使用JavaScript的内置数组构造new Array()
使用[]代替。
这两种不同的语句都创建一个新的空数组命名为几点:
var points = new Array();
// Bad
var points = [];
// Good
这两种不同的语句都创建一个包含6个号码一个新的数组:
var points = new Array(40, 100, 1, 5, 25, 10) // Bad
var points = [40, 100, 1, 5, 25, 10];
// Good
试一试» 在new关键字唯一代码的复杂性。 它也可以产生一些意想不到的结果:
var points = new Array(40, 100); // Creates an array with two elements (40 and 100)
如果我删除哪些因素之一?
var points = new Array(40); // Creates an array with 40 undefined elements !!!!!
试一试» 如何识别一个数组
一个常见的问题是:我怎么知道,如果一个变量是一个数组?
问题是,JavaScript的运营商typeof返回“对象”:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
typeof fruits; // returns object
试一试» typeof运算符返回对象,因为JavaScript数组是一个对象。
解决方案1:
为了解决这个问题ECMAScript 5定义了一个新方法Array.isArray()
Array.isArray(fruits); // returns true
试一试» 这种解决方案的问题是, ECMAScript 5 不能在较早的浏览器支持 。
解决方案2:
为了解决这个问题,你可以创建自己的isArray()函数:
function isArray(x) {
return
x.constructor.toString().indexOf("Array") > -1;
}
试一试» 如果参数是一个数组就永远的函数返回true。
或者更准确地说:如果对象原型包含单词“阵列”则返回true。
解决方案3:
该instanceof如果对象是由给定的构造函数创建运算符返回true:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits instanceof Array // returns true
试一试»