JavaScript에서 배열에 요소 추가 배열의 끝에 새 항목을 추가하는 것을 의미합니다. , 이 프로세스는 배열의 길이를 확장하여 새로운 데이터를 수용합니다. JavaScript는 하나 이상의 요소를 인수로 받아들이고 이를 배열 끝에 추가하는 요소 추가에 대한 여러 가지 방법을 제공합니다.
문제를 해결하는 방법은 다음과 같습니다.
내용의 테이블
- JavaScript push() 메소드 사용
- JavaScript unshift() 메소드 사용
- JavaScript splice() 메소드 사용
- JavaScript concat() 메소드 사용
- 자바스크립트 스프레드 연산자
- Lodash _.concat() 함수 사용
- 배열 길이 속성 사용
1. JavaScript push() 메소드 사용
JavaScript push() 메서드 배열의 끝에 요소를 추가하는 반면, 그 쌍둥이 기능인 팝() 메서드 , 배열 끝에서 요소를 제거합니다. 배열의 끝에 요소 하나 또는 여러 요소를 추가해야 하는 경우 푸시() 메서드 거의 항상 가장 간단하고 빠른 옵션이 될 것입니다.
통사론:
array.push(item1, item2, ..., itemX)>
예: 이 예에서는 push() 메서드를 사용하여 배열 끝에 새 요소를 추가합니다.
자바스크립트 // Input array let Geeks = ['Geeks1', 'Geeks2', 'Geeks3', 'Geeks4']; // Display input array console.log('Original Array: ' + Geeks); // Pushing arrays Geeks.push('Geeks5', 'Geeks6'); // Display updated array console.log('Updated Array: ' + Geeks);> 산출
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks3,Geeks4,Geeks5,Geeks6>
2. JavaScript unshift() 메소드 사용
JavaScript unshift() 메서드 배열의 시작 부분에 요소를 추가하는 반면, 쌍 함수인 Shift()는 배열의 시작 부분에서 하나의 요소를 제거합니다.
통사론:
array.unshift(item1, item2, ..., itemX)>
예: 이 예에서는 unshift() 메서드를 사용하여 배열의 시작 부분에 새 요소를 추가합니다.
자바스크립트 // Input array let Geeks = ['Geeks1', 'Geeks2', 'Geeks3', 'Geeks4']; // Display input array console.log('Original Array: ' + Geeks); // Adding element in begining Geeks.unshift('Geeks5', 'Geeks6'); // Display updated array console.log('Updated Array: ' + Geeks);> 산출
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks5,Geeks6,Geeks1,Geeks2,Geeks3,Geeks4>
3. JavaScript splice() 메소드 사용
JavaScript splice() 메서드 기존 요소를 제거하거나 새 요소를 추가하여 배열의 내용을 수정합니다.
통사론:
array.splice(index, amount, item1, ....., itemX)>
예: 이 예에서는 splice() 메서드를 사용하여 배열의 세 번째 인덱스에 새 요소를 추가합니다.
자바스크립트 // Input array let Geeks = ['Geeks1', 'Geeks2', 'Geeks3', 'Geeks4']; // Display input array console.log('Original Array: ' + Geeks); // Update array using slice Geeks.splice(2, 1, 'Geeks5', 'Geeks6'); // Display updated array console.log('Updated Array: ' + Geeks);> 산출
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks5,Geeks6,Geeks4>
4. JavaScript concat() 메소드 사용
JavaScript concat() 메서드 호출된 배열로 구성된 새로운 결합 배열을 반환하고 인수의 배열(또는 배열)과 결합됩니다. 이 메서드는 두 개 이상의 배열을 결합하는 데 사용되며 이 메서드는 기존 배열을 변경하지 않지만 결합된 배열의 값을 포함하는 새 배열을 반환합니다.
통사론:
array1.concat(array2, array3, ..., arrayX)>
예: 이 예에서는 다음을 사용하여 세 개의 배열을 병합합니다. concat() 메서드 자바스크립트의.
자바스크립트 // Input arrays let g1 = ['Geeks1', 'Geeks2']; let g2 = ['Geeks3', 'Geeks4']; let g3 = ['GeeksForGeeks']; // Concate g1, g2 and g3 into g4 let g4 = g1.concat(g2, g3); //Display output console.log(g4);>
산출
[ 'Geeks1', 'Geeks2', 'Geeks3', 'Geeks4', 'GeeksForGeeks' ]>
5. 자바스크립트 스프레드 연산자
자바스크립트 스프레드 연산자 0+ 인수가 예상되는 위치에서 반복 가능 항목을 확장할 수 있습니다. 2개 이상의 값이 예상되는 변수 배열에서 주로 사용됩니다. 이는 배열에서 매개변수 목록을 얻을 수 있는 권한을 허용합니다.
통사론:
let variablename1 = [...value];>
예: 이 예에서는 위에서 설명한 접근 방식의 구현을 보여줍니다.
자바스크립트 // Input arrays let Array1 = [2, 4, 6, 8]; let Array2 = [3, 5, 7] // Combine and create new array // using spread operator newArray = [ ...Array1, ...Array2] // Display output console.log(newArray);>
산출
[ 2, 4, 6, 8, 3, 5, 7 ]>
6. Lodash _.concat() 함수 사용
값이 1개 이상 필요합니다. 이를 통해 값을 배열에 병합할 수 있습니다.
통사론:
_.concat(array, [values]);>
예: 이 예에서는 위에서 설명한 접근 방식의 구현을 보여줍니다.
자바스크립트 // Requiring the lodash library let lodash = require('lodash'); // Original array to be concatenated let array = [1, 2, 3]; // Values to be added to original array let values = [0, 5, 'a', 'b'] let newArray = lodash.concat(array, values); console.log('Before concat: ' + array); // Printing newArray console.log('After concat: ' + newArray);> 산출:
Before concat: 1,2,3 After concat: 1,2,3,0,5,a,b>
7. 배열 길이 속성 사용
JavaScript 배열에는 배열 끝에 요소를 동적으로 추가하는 데 사용할 수 있는 길이 속성이 있습니다. 배열의 현재 길이와 동일한 인덱스에 값을 할당하면 새 요소를 추가할 수 있습니다.
예:
자바스크립트 // Input array let Geeks = ['Geeks1', 'Geeks2', 'Geeks3', 'Geeks4']; // Display input array console.log('Original Array: ' + Geeks); // Append element using the length property Geeks[Geeks.length] = 'Geeks5'; // Display updated array console.log('Updated Array: ' + Geeks);> 산출
Original Array: Geeks1,Geeks2,Geeks3,Geeks4 Updated Array: Geeks1,Geeks2,Geeks3,Geeks4,Geeks5>