모든 초보자가 알아야 할 6 가지 유용한 JavaScript 배열 방법

실용적인 예제가 포함 된 강력한 JavaScript 초보자 배열 방법

Unsplash에 Shamin의 사진

소개

JavaScript의 배열은 매우 유용하고 중요하며 주로 데이터를 저장하고 조작하는 데 사용됩니다. JavaScript에서 이러한 유형의 데이터 구조로 작업하는 것은 매우 간단합니다. 특히 ES6와 같은 언어의 새로운 기능을 예로 사용하는 경우 더욱 그렇습니다. 배열은 프로토 타입에 순회 및 변형 작업을 수행하는 메서드가있는 목록과 유사한 객체입니다.

이 기사에서는 알아야 할 JavaScript의 몇 가지 유용한 배열 메서드를 살펴 보겠습니다. 바로 시작합시다.

이미지 Created with ❤️️ By Mehdi Aoussiad.

1. 푸시 방법

push()JavaScript 의 메소드 는 배열 끝에 요소를 추가하는 기능을 제공합니다. 한번 시도해 봅시다.

아래 예를 살펴보십시오.

let arr = [ 1, 2, 3 ];
arr.push(4);
console.log(arr); //Prints: [ 1, 2, 3, 4 ]

2. 팝 방식

pop()JavaScript 의 메서드 는 배열의 마지막 요소를 제거합니다.

다음 예를 살펴보십시오.

let arr = [ 1, 2, 3, 4 ];

arr.pop();

console.log(arr)

// output [ 1, 2, 3 ];

3. 이동 및 이동 해제 방법

방법 shift()은의 반대입니다 pop. JavaScript에서 배열의 첫 번째 요소를 제거합니다. 한번 시도해 봅시다.

아래 예를 살펴보십시오.

let arr = [ 1, 2, 3, 4 ];

arr.shift();

console.log(arr)

// [ 2, 3, 4 ];

다음 예를 살펴 보겠습니다.

let arr = [ 1, 2, 3 ];

arr.unshift('hello');

console.log(arr);

// [ 'hello' , 1, 2, 3 ];

4. 조인 방법

이 메서드를 join()사용하면 JavaScript에서 배열을 문자열로 변환 할 수 있습니다. 모든 배열 요소를 문자열에 결합합니다. 그 외에도 구분 기호를 지정할 수 있습니다. 한번 시도해 봅시다.

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var joinedStr = fruits.join(" * ");
console.log(joinedStr); //Output: Banana * Orange * Apple * Mango

다음은 분리 자로 빈 문자열을 사용하여 동일한 배열을 결합한 또 다른 예입니다.

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var joinedStr = fruits.join(" ");
console.log(joinedStr); //Output: Banana  Orange  Apple  Mango

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var str = fruits.toString();
console.log(str); //Output: Banana,Orange,Apple,Mango

이 메서드 splice()는 JavaScript의 배열에서 요소를 추가하고 제거 할 수 있습니다. 세 가지 매개 변수를 허용합니다.

  1. 첫 번째 매개 변수 (start)는 요소를 삽입하거나 제거해야하는 색인을 지정합니다.
  2. 두 번째 매개 변수는 제공된 시작 색인부터 제거 할 총 요소 수를 지정합니다.
  3. 세 번째 매개 변수는 배열에 추가하려는 요소를 지정합니다.

let friends = ['Ope', 'Dupe', 'Ola'];
//Adds Ayobami at the array of friends at index 3. And removes 0(nothing).
friends.splice(3, 0, 'Ayobami'); // Ope, Dupe, Ola, Ayobami

6. 슬라이스 방법

이 메서드 slice()는 배열 조각을 복사하는 데 사용됩니다. 전체 배열을 복사 할 수도 있습니다.

slice 메서드는 지정된 시작 인수와 인수 에서 시작하는 요소를 선택 하지만 지정된 인수를 포함하지 않습니다 . 따라서 시작 및 끝 인덱스의 두 인수를 사용합니다.

아래 예를 살펴보십시오.

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3);
Console.log(citrus); // Output: ["Orange", "Lemon"]

결론

보시다시피 JavaScript의 모든 배열 메서드를 다루지는 않았습니다. 그러나 이러한 유용한 메서드를 마스터하면 JavaScript에서 배열을 쉽게 조작하고 작업하는 방법을 이해할 수 있습니다.

이 기사를 읽어 주셔서 감사합니다. 도움이 되었기를 바랍니다.

추가 읽기

알아야 할 10 가지 JavaScript 문자열 메서드

Suggested posts

JavaScript의 이벤트 루프

호출 스택, 웹 API, 이벤트 대기열, 마이크로 작업, 매크로 작업

JavaScript의 이벤트 루프

이벤트 루프는 JavaScript의 비동기 프로그래밍의 비밀입니다. JS는 단일 스레드에서 모든 작업을 실행하지만 몇 가지 스마트 데이터 구조를 사용하면 멀티 스레딩의 환상을 얻을 수 있습니다.

Python Datetime 모듈에서 반드시 알아야 할 4 가지 객체

포괄적 인 실용적인 가이드

Python Datetime 모듈에서 반드시 알아야 할 4 가지 객체

시간은 많은 데이터 과학 관련 작업에서 중요한 기능입니다. 예를 들어, 일일 판매 및 재고 정보는 소매 분석에 매우 중요합니다.

Related posts

성능 최적화 된 A / B 테스트 솔루션

성능 최적화 된 A / B 테스트 솔루션

의제 : 소개 : TL;하지만 읽을 수 있습니다. A / B 테스트, CloudFront 및 Lamba @ edge에 대해 이미 알고있는 경우 AWS Lambda @ edge를 사용한 A / B 테스트로 직접 이동하십시오. A / B 테스트 란 무엇입니까? A / B 테스트는 웹 사이트의 두 가지 버전에 대한 사용자의 참여를 비교하는 데 초점을 맞춘 UX 연구 방법론입니다.

fp-ts (Typescript)에서 Option 및 둘 중 하나 사용

저는 함수형 프로그래밍을 좋아합니다. 몇 년 동안 실수를하거나 토끼 구멍을 뚫는 것으로부터 저를 몇 번 구해 주었기 때문입니다. 동일한 입력이 주어지면 출력이 항상 동일하다는 것을 알면 안심입니다.

Syncfusion Blazor 파일 업로드 구성 요소에서 이미지를 미리 보는 방법

Syncfusion Blazor 파일 업로드 구성 요소에서 이미지를 미리 보는 방법

Syncfusion Blazor 파일 업로드는 하나 이상의 파일, 이미지, 문서, 오디오, 비디오 및 기타 파일을 서버에 업로드하기위한 구성 요소입니다. 여러 파일 선택, 진행률 표시 줄, 자동 업로드, 끌어서 놓기, 폴더 (디렉터리) 업로드, 파일을 포함하는 다양한 기능을 갖춘 HTML5 업로드 구성 요소 (<input type =”file”>)의 확장 버전입니다. 검증 등.

6 React 개발자로서 후회

내가 일찍했으면하는 것

6 React 개발자로서 후회

React는 배울 수있는 훌륭한 도구입니다. 그것은 우리가 우리 자신의 방식으로 일을 할 수있게합니다.