>  기사  >  웹 프론트엔드  >  JavaScript의 배열 지식 요약

JavaScript의 배열 지식 요약

WBOY
WBOY앞으로
2022-06-30 12:30:182302검색

이 글은 javascript에 대한 관련 지식을 제공합니다. 주로 페이지 태그 선택, 페이지 태그 속성 운영 등 DOM API 지식과 관련된 문제를 정리합니다. 모두에게 도움이 되기를 바랍니다.

JavaScript의 배열 지식 요약

[관련 권장 사항: javascript 비디오 튜토리얼, web front-end]

배열의 개념

  • 배열도 일반적인 객체와 비슷한 기능을 갖고 있는 객체입니다.
  • 차이점은 일반 객체는 문자열을 속성 이름으로 사용하는 반면 배열은 숫자를 인덱스로 사용
  • 인덱스: 0부터 시작하는 정수는 인덱스입니다.
  • 배열의 저장 성능은 다음과 같습니다. 일반 객체보다 더 좋습니다. 개발 중에 일부 데이터를 저장하기 위해 배열을 사용하는 경우가 많습니다.

배열 객체 만들기

구문 1: var array name = new Array();
괄호 안에 숫자 값이 전달되면 배열 길이를 나타냅니다. 1보다 큰 값이 전달되면 이는 배열에 요소를 추가하는 것을 의미합니다.

var 数组名 = new Array();
当在括号内传入一个数字类型的值时,表示数组的长度,当传入大于1个的值时,表示向数组中添加元素。

语法2:var 数组名 =[];
当在方括号内传入值时,即为数组添加元素。

使用typeof检查数组对象时返回Object

向数组中添加元素

1.直接添加

语法:数组名 = [元素1,元素2...];

2.按照索引添加(将元素添加到哪个位置)

语法:数组名[索引] = '元素';

这里值得注意的是,如果按照索引添加元素,数组的长度是按照的添加的最大索引来计算的。

读取数组中的元素

读取数组元素是一个返回值,需要变量去接收或者直接输出。
1.直接读取,即读取整个数组内的元素。

语法:console.log(数组名);

2.读取数组中的某个元素。

语法:console.log(数组名[索引]);

3.当读取一个不存在的元素时,返回undefined。

数组中的常用属性和方法

1.length属性

length属性可以设置/返回数组长度。

  • 设置数组长度:数组名.length = 长度;
    当设置的数组长度>原数组长度时,将空出多余的空间。
    当设置的数组长度
  • 返回数组长度:数组名.length;

JavaScript의 배열 지식 요약

补充小技巧:可以利用length属性向数组的最后一个位置添加元素
JavaScript의 배열 지식 요약

2.cancat方法

concat() 方法用于连接两个或多个数组。

语法:数组1.concat(数组2,数组3...);

JavaScript의 배열 지식 요약

3.join方法

join() 方法用于把数组中的所有元素转换一个字符串。

语法:数组名.join(分隔符,不写则默认为逗号分隔);

JavaScript의 배열 지식 요약

4.pop方法

pop() 方法用于删除数组的最后一个元素返回删除的元素

语法:数组名.pop();

JavaScript의 배열 지식 요약

5.push方法

push() 方法可向数组的末尾添加一个或多个元素,并返回新的长度

语法:数组名.push(元素1,元素2...);

구문 2: var array name =[];
대괄호 안에 값이 전달되면 요소가 배열에 추가됩니다.

JavaScript의 배열 지식 요약

typeof를 사용하여 배열 개체를 확인할 때 Object를 반환합니다. 🎜🎜배열에 요소 추가🎜🎜1. 직접 추가 🎜🎜🎜 구문: 배열 이름 = [요소 1, 요소 2...] 🎜🎜🎜 2. 인덱스에 따라 요소 추가( 요소 추가 어느 위치에 추가)🎜🎜🎜구문: ​​배열 이름 [색인] = '요소';🎜🎜🎜여기서 주목할 가치가 있는 것은 요소가 색인에 따라 추가되면 길이가 최대 인덱스를 기준으로 계산된 대로 배열이 추가됩니다. 🎜🎜배열의 요소 읽기🎜🎜배열의 요소를 읽는 것은 반환 값이며, 이를 직접 수신하거나 출력하려면 변수가 필요합니다.
1. 직접 읽기, 즉 전체 배열의 요소를 읽는 것입니다. 🎜🎜🎜구문: ​​console.log(배열 이름);🎜🎜🎜2. 배열의 요소를 읽습니다. 🎜🎜🎜구문: ​​console.log(배열 이름[색인]);🎜🎜🎜3. 존재하지 않는 요소를 읽을 때는 정의되지 않은 값을 반환합니다. 🎜🎜🎜배열에서 일반적으로 사용되는 속성과 메서드🎜🎜

🎜1.length 속성🎜

🎜length 속성은 배열 길이를 🎜설정/반환🎜할 수 있습니다. 🎜🎜🎜배열 길이 설정: 배열 이름.길이 = 길이;
설정된 배열 길이 > 원래 배열 길이인 경우 초과 공간이 비워집니다.
설정된 배열 길이가 배열 이름.길이;🎜🎜🎜여기에 이미지 설명 삽입🎜🎜추가 팁: 길이 속성을 사용하여 요소🎜를 🎜마지막 위치에 추가할 수 있습니다. 배열.
여기에 이미지 설명 삽입
🎜

🎜2.cancat method🎜

🎜concat() 메서드는 두 개 이상의 배열을 연결하는 데 사용됩니다. 🎜🎜🎜구문: ​​array1.concat(array2,array3...);🎜🎜🎜여기에 그림 설명 삽입🎜

🎜3.join 메소드🎜

🎜join() 메소드가 사용됨 모든 요소 변환 배열을 문자열로. 🎜🎜🎜 구문: 배열 이름.join(구분 기호, 작성하지 않으면 기본값은 쉼표 구분);🎜🎜🎜여기에 이미지 설명 삽입🎜

🎜4.pop method🎜

🎜pop() 방법 배열의 🎜마지막 요소🎜를 제거하고 🎜제거된 요소를 반환🎜하는 데 사용됩니다. 🎜🎜🎜구문: ​​배열 이름.pop();🎜🎜🎜여기에 이미지 설명 삽입🎜

🎜5.push method🎜

🎜push() 메서드는 배열 끝에 하나 이상을 추가할 수 있습니다. 🎜 요소 🎜 및 🎜새 길이를 반환 🎜합니다. 🎜🎜🎜구문: ​​배열 이름.push(요소 1, 요소 2...);🎜🎜🎜🎜🎜

6.shift 메소드

shift() 메소드는 배열의 첫 번째 요소를 삭제하고 첫 번째 요소의 값을 반환하는 데 사용됩니다. shift() 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。

语法:数组名.shift();

JavaScript의 배열 지식 요약

7.unshift方法

unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度

语法:数组名.unshift(元素1,元素2...);

JavaScript의 배열 지식 요약

8.slice方法

slice() 方法可从已有的数组中返回选定的元素。可提取字符串的某个部分,并以新的字符串返回被提取的部分。注意: slice() 方法不会改变原始数组。

语法:数组名.slice(start,end);区间为左闭右开
如果为负数则从数组的倒数第几个数取。

JavaScript의 배열 지식 요약

9.splice方法

splice() 方法用于添加删除数组中的元素。

语法:数组名.splice(从哪个位置开始(必填),要删除的元素个数(可选),要添加的元素(可选))

JavaScript의 배열 지식 요약
JavaScript의 배열 지식 요약

10.reverse方法

reverse() 方法用于颠倒数组中元素的顺序

语法:数组名.reverse();

JavaScript의 배열 지식 요약

11.sort方法

sort() 方法用于对数组的元素进行排序。排序顺序可以是字母或数字,并按升序或降序。默认排序顺序为按字母升序。

语法:数组名.sort();

1.按字母排序(升序/降序)

JavaScript의 배열 지식 요약

2.按数字排序(从大到小/从小到大)需定义一个函数。
JavaScript의 배열 지식 요약

数组的遍历

使用for循环可进行对数组的遍历。

语法:for(var 变量=0; 变量<blockquote></blockquote>

구문: 배열 이름.shift();

JavaScript의 배열 지식 요약여기에 이미지 설명 삽입

7.unshift methodunshift() 메서드는 배열의 시작 부분에 하나 이상의 요소

를 추가할 수 있으며

새로운 길이를 반환하세요.

구문: 배열 이름.unshift(요소 1, 요소 2...);


JavaScript의 배열 지식 요약여기에 그림 설명 삽입

8.slice methodslice() 메서드는 기존 반품에서 사용할 수 있습니다. 배열에서 선택된 요소. 문자열의 일부를 추출하고 추출된 부분을 새 문자열로 반환합니다. 참고: Slice() 메서드는 원래 배열을 변경하지 않습니다.
구문: array name.slice(start,end);간격은 왼쪽이 닫히고 오른쪽이 열립니다 음수인 경우 배열의 마지막 숫자에서 가져옵니다. 정렬.

🎜🎜🎜9. splice 메서드 🎜🎜🎜splice() 메서드는 배열의 요소를 🎜 추가 🎜하거나 🎜 삭제 🎜하는 데 사용됩니다. 🎜
🎜구문: 배열 이름.스플라이스(어느 위치에서(필수), 삭제할 요소 수(선택), 추가할 요소(선택))🎜🎜 🎜여기에 이미지 설명 삽입🎜여기에 이미지 설명 삽입🎜🎜10.reverse method🎜🎜reverse() 메서드는 배열 요소의 🎜순서🎜를 🎜역전하는 데 사용됩니다. 🎜
🎜구문: 배열 이름.reverse();🎜🎜🎜여기에 이미지 설명 삽입🎜🎜🎜11.sort method🎜🎜🎜sort() 메서드는 배열의 요소를 정렬하는 데 사용됩니다. 정렬 순서는 알파벳순이나 숫자순, 오름차순 또는 내림차순일 수 있습니다. 기본 정렬 순서는 알파벳순으로 오름차순입니다. 🎜
🎜구문: array name.sort();🎜🎜🎜1. 알파벳순으로 정렬(오름차순/내림차순)🎜🎜여기에 그림 설명 삽입🎜🎜2. 숫자(큰 것에서 작은 것, 작은 것에서 큰 것)로 정렬하려면 함수 정의가 필요합니다. 🎜여기에 이미지 설명 삽입🎜🎜🎜배열 순회🎜 🎜🎜 for 루프를 사용하여 배열을 탐색합니다. 🎜
🎜구문: for(var 변수=0; 변수🎜🎜🎜🎜🎜 🎜🎜Array 순회 작은 연습🎜🎜🎜🎜배열에 6개의 개체를 추가하고 성인 목록을 새 배열에 추가하세요! ! 🎜🎜<pre class="brush:php;toolbar:false">nbsp;html&gt;     &lt;meta&gt;     &lt;meta&gt;     &lt;meta&gt;     &lt;title&gt;Document&lt;/title&gt;     &lt;script&gt; function Person(name, age){ this.name = name; this.age = age; } var per1 =new Person(&amp;#39;苏凉&amp;#39;,21); var per2 =new Person(&amp;#39;小红&amp;#39;,15); var per3 =new Person(&amp;#39;小月&amp;#39;,17); var per4 =new Person(&amp;#39;小丽&amp;#39;,19); var per5 =new Person(&amp;#39;小水&amp;#39;,20); var per6 =new Person(&amp;#39;小花&amp;#39;,5); var per_list= [per1,per2,per3,per4,per5,per6]; function arrAdult(){ var newArr=[]; for(var i = 0;i&lt;per_list.length;i++){ var x = per_list[i]; if(x.age&lt;18){ console.log(x.name + &amp;#39;未通过&amp;#39;); }else if(x.age&gt;=18){ console.log(x.name + &amp;#39;恭喜你,通过了!&amp;#39;); newArr.push(x.name) } } return newArr; } var list = arrAdult(); console.log(&amp;#39;通过名单:&amp;#39;+ list) &lt;/script&gt;     </pre>🎜실행 결과: 🎜🎜🎜🎜🎜

위 내용은 JavaScript의 배열 지식 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 csdn.net에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제