JavaScript에서 배열 배열 생성 및 사용에 대한 토론

배열은 순서대로 배열된 값의 집합이지만, 객체의 속성 이름은 순서가 없습니다. 기본적으로 배열은 숫자를 조회 키로 사용하는 반면 객체는 사용자 정의 속성 이름을 갖습니다. JavaScript에는 실제 연관 배열이 없지만 객체를 사용하여 연관된 함수를 구현할 수 있습니다.

Array()는 Object()의 특수한 유형일 뿐입니다. 즉, Array() 인스턴스는 기본적으로 일부 기능이 포함된 Object()입니다. 추가 기능) 인스턴스. 배열은 언제든지 업데이트하거나 삭제할 수 있는 모든 유형의 값을 저장할 수 있으며 배열의 크기는 객체 외에도 JavaScript에서 가장 일반적으로 사용되는 유형일 수 있습니다. 게다가 JavaScript의 배열은 대부분의 다른 언어의 배열과 상당히 다릅니다. 이 기사에서는 javascript의 배열 Array 유형을 소개합니다

배열 만들기
배열을 만드는 방법에는 두 가지가 있습니다: 리터럴 구문을 사용하는 것과 Array() 생성자를 사용하는 것

【 리터럴 】

배열 리터럴을 사용하는 것이 배열을 만드는 가장 쉬운 방법입니다. 배열 요소를 대괄호 안에 쉼표로 구분하기만 하면 됩니다.

var empty = []; //没有元素的数组
var primes = [2,3,5,7,11]; //有5个数值的数组

자바스크립트 배열과 다른 언어의 배열은 데이터 An입니다. 정렬된 목록이지만 다른 언어와 달리 JavaScript 배열의 각 항목은 모든 유형의 데이터를 저장할 수 있습니다

var misc = [1.1,true, "a"]; //3个不同类型的元素

배열 리터럴의 값은 상수일 필요는 없으며 모든 표현식이 될 수 있습니다

var base = 1024;
var table = [base,base+1,base+2,base+3];

객체 리터럴이나 다른 배열 리터럴을 포함할 수 있습니다

var b = [ [1,{x:1,y:2}],[2,{x:3,y:4}] ];

배열의 요소가 여전히 배열이면 다차원 배열이 형성됩니다

var a = [[1, 2], [3, 4]];

[참고] 표현 시 숫자 리터럴을 사용하세요. , 배열 생성자는 호출되지 않습니다

[Constructor]

생성자를 호출하는 방법에는 세 가지가 있습니다

　【1】매개 변수 없이 빈 배열을 만듭니다

//该方法创建一个没有任何元素的空数组，等同于数组直接量[]
var a = new Array();

　　【2 】 배열의 길이를 지정하는 숫자형 매개변수가 있습니다

var a = new Array(10);
console.log(a);//[]
console.log(a[0],a.length);//undefined 10

　 [참고] 다른 유형의 매개변수가 있으면 해당 값을 포함하는 항목이 하나만 있는 배열이 생성됩니다

var a = new Array('10');
console.log(a);//['10']
console.log(a[0],a.length);//10 1

　【3】매개변수가 여러 개인 경우 해당 매개변수는 배열의 특정 요소로 표현됩니다.

var a = new Array(1,2,3);
console.log(a);//[1,2,3]
console.log(a[0],a[1],a[2]);//1 2 3

Array() 생성자를 사용할 때 new 연산자를 생략할 수 있습니다

var a1 = Array();
var a2 = Array(10);
var a3 = Array(1,2,3);
console.log(a1,a2,a3);//[] [] [1,2,3]

배열의 본질
　배열은 순서대로 배열된 값의 집합입니다. 본질적으로 배열은 특별한 객체입니다

typeof [1, 2, 3] // "object"

　배열의 특징은 키 이름은 순서(0, 1, 2…)로 배열된 정수 집합입니다. 배열 멤버의 키 이름은 고정되어 있으므로 배열은 각 요소에 대한 키 이름을 지정할 필요가 없지만 객체의 각 멤버는 키 이름을 지정해야 합니다. 배열은 대괄호를 사용하여 배열에 액세스합니다. . 요소는 객체의 속성에 액세스하기 위해 대괄호를 사용하는 것과 같습니다. JavaScript 언어에서는 객체의 키 이름이 항상 문자열이라고 규정하므로 배열의 키 이름은 실제로 문자열입니다. 숫자로 읽을 수 있는 이유는 문자열이 아닌 키 이름이 문자열로 변환되어 속성 이름으로 사용되기 때문입니다

var arr = ['a', 'b', 'c'];
console.log(Object.keys(arr));// ["0", "1", "2"]
var obj = {
name1: 'a',
name2: 'b',
name3: 'c'
};

　단, 배열 인덱스와 객체 속성 이름을 구별해야 합니다. 모든 인덱스는 속성입니다. 이름이지만 0~232-2(4294967294) 사이의 정수 속성 이름만 인덱스입니다

o={}; //创建一个普通的对象
o[1]="one"; //用一个整数来索引它
//数值键名被自动转成字符串
var arr = ['a', 'b', 'c'];
arr['0'] // 'a'
arr[0] // 'a'

　　

[참고] 단일 값은 식별자(식별자)로 사용할 수 없습니다. 따라서 배열 멤버는 대괄호로만 나타낼 수 있습니다.

var a = [];
//索引
a['1000'] = 'abc';
a[1000] // 'abc'
//索引
a[1.00] = 6;
a[1] // 6

음수 또는 정수가 아닌 숫자를 사용하여 배열을 인덱싱할 수 있습니다. 하지만 0~2의 32-2승 범위에 있지 않기 때문에 배열의 인덱스가 아닌 배열의 속성 이름일 뿐이며, 분명한 특징은 배열의 길이를 변경하지 않는다는 것입니다. array

var arr = [1, 2, 3];
arr[0];//1
arr.0;//SyntaxError

array Length

모든 배열에는 길이 속성이 있는데, 이것이 일반 JavaScript 개체와 다릅니다. 조밀한(즉, 희소하지 않은) 배열의 경우 길이 속성 값은 배열의 요소 수를 나타내며 해당 값은 배열이 희소 배열인 경우 길이 속성이 배열의 가장 큰 인덱스보다 1 더 큽니다. 값이 요소보다 큽니다. 인덱스 i가 기존 배열의 길이보다 크거나 같으면 길이 속성의 값이 i+1

로 설정됩니다.

var arr = ['a', 'b'];
arr.length // 2
arr[2] = 'c';
arr.length // 3
arr[9] = 'd';
arr.length // 10
arr[1000] = 'e';
arr.length // 1001

　　【2】设置length属性为小于当前长度的非负整数n时，当前数组索引值大于等于n的元素将从中删除

a=[1,2,3,4,5]; //从5个元素的数组开始
a.length = 3; //现在a为[1,2,3]
a.length = 0; //删除所有的元素。a为[]
a.length = 5; //长度为5，但是没有元素，就像new

　　【3】将数组的length属性值设置为大于其当前的长度。实际上这不会向数组中添加新的元素，它只是在数组尾部创建一个空的区域

var a = ['a'];
a.length = 3;
console.log(a[1]);//undefined
console.log(1 in a);//false

　　如果人为设置length为不合法的值(即0——232-2范围以外的值)，javascript会报错

// 设置负值
[].length = -1// RangeError: Invalid array length
// 数组元素个数大于等于2的32次方
[].length = Math.pow(2,32)// RangeError: Invalid array length
// 设置字符串
[].length = 'abc'// RangeError: Invalid array length

　　由于数组本质上是对象，所以可以为数组添加属性，但是这不影响length属性的值

var a = [];
a['p'] = 'abc';
console.log(a.length);// 0
a[2.1] = 'abc';
console.log(a.length);// 0

数组遍历

　　使用for循环遍历数组元素最常见的方法

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

　　当然，也可以使用while循环

var a = [1, 2, 3];
var i = 0;
while (i < a.length) {
console.log(a[i]);
i++;
}
var l = a.length;
while (l--) {
console.log(a[l]);
}

　　但如果数组是稀疏数组时，使用for循环，就需要添加一些条件

//跳过不存在的元素
var a = [1,,,2];
for(var i = 0; i < a.length; i++){
if(!(i in a)) continue;
console.log(a[i]);
}

　　还可以使用for/in循环处理稀疏数组。循环每次将一个可枚举的属性名（包括数组索引）赋值给循环变量。不存在的索引将不会遍历到

var a = [1,,,2];
for(var i in a){
console.log(a[i]);
}

　　由于for/in循环能够枚举继承的属性名，如添加到Array.prototype中的方法。由于这个原因，在数组上不应该使用for/in循环，除非使用额外的检测方法来过滤不想要的属性

var a = [1,,,2];
a.b = 'b';
for(var i in a){
console.log(a[i]);//1 2 'b'
} 
//跳过不是非负整数的i
var a = [1,,,2];
a.b = 'b';
for(var i in a){
if(String(Math.floor(Math.abs(Number(i)))) !== i) continue;
console.log(a[i]);//1 2
}

　　javascript规范允许for/in循环以不同的顺序遍历对象的属性。通常数组元素的遍历实现是升序的，但不能保证一定是这样的。特别地，如果数组同时拥有对象属性和数组元素，返回的属性名很可能是按照创建的顺序而非数值的大小顺序。如果算法依赖于遍历的顺序，那么最好不要使用for/in而用常规的for循环

　　有三个常见的类数组对象：

　　【1】arguments对象

// arguments对象
function args() { return arguments }
var arrayLike = args('a', 'b');
arrayLike[0] // 'a'
arrayLike.length // 2
arrayLike instanceof Array // false

　　【2】DOM方法(如document.getElementsByTagName()方法)返回的对象

// DOM元素
var elts = document.getElementsByTagName('h3');
elts.length // 3
elts instanceof Array // false

　　【3】字符串

// 字符串
'abc'[1] // 'b'
'abc'.length // 3
'abc' instanceof Array // false

　　[注意]字符串是不可变值，故当把它们作为数组看待时，它们是只读的。如push()、sort()、reverse()、splice()等数组方法会修改数组，它们在字符串上是无效的，且会报错

var str = 'abc';
Array.prototype.forEach.call(str, function(chr) {
console.log(chr);//a b c
});
Array.prototype.splice.call(str,1);
console.log(str);//TypeError: Cannot delete property '2' of [object String]

　　数组的slice方法将类数组对象变成真正的数组

var arr = Array.prototype.slice.call(arrayLike);

　　javascript数组方法是特意定义为通用的，因此它们不仅应用在真正的数组而且在类数组对象上都能正确工作。在ECMAScript5中，所有的数组方法都是通用的。在ECMAScript3中，除了toString()和toLocaleString()以外的所有方法也是通用的

var a = {'0':'a','1':'b','2':'c',length:3};
Array.prototype.join.call(a,'+');//'a+b+c'
Array.prototype.slice.call(a,0);//['a','b','c']
Array.prototype.map.call(a,function(x){return x.toUpperCase();});//['A','B','C']

위 내용은 JavaScript에서 배열 배열 생성 및 사용에 대한 토론의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!