파피루스

[javascript] Array.from() 본문

Today I Learned

[javascript] Array.from()

떼굴펜 2024. 4. 27. 23:49

 정적 메서드란 객체 인스턴스화 하지 않아도 호출 할 수 있는 메서드를 말한다.

인스턴스를 이용한 메서드(동적 메서드)는 '변수.메서드'와 같은 형태, 정적 메서드는 이용할 '타입.메서드'로 이용한다.

// 동적 메서드 : 객체 인스턴스를 이용해 접근해야 함
new Array(1,2,3).foreach( .... );     // 생성자를 이용해 객체 인스턴스를 생성 -> 객체를 통해 foreach문 이용

// 정적 메서드 : 객체 인스턴스가 없이도 접근할 수 있음
Array.from(...);                                // Array 객체 생성 없이도 이용 가능 

 

 Javascript 의 Array객체에는 총 네가지의 정적 메서드가 있다.  

(1) Array.from(object)
(2) Array.fromAsync()
(3) Array.isArray()
(4) Array.of()

 

 

 

(1) Array.from()

@iterator 메서드가 구현되어 있는 순회 가능 객체 혹은 유사 배열 객체로부터, 얕게 복사된 새로운 Array 인스턴스를 생성한다.

 

구문

Array.from(arrayLike, mapFn, thisArg);

  • 매개변수
    • [필수] arrayLike : 배열로 변환할 객체
    • [선택] mapFn : (element, index) => { return A; }
    • [선택] thisArg : mapFn 실행 시의 this 값
  • 반환값 : new Array 인스턴스

사용 예시

console.log(Array.from('foo'));    // Expected output: Array ["f", "o", "o"]
console.log(Array.from([1, 2, 3], (x) => x + x));     // Expected output: Array [2, 4, 6]

 

참고 : 2015년부터 다양한 브라우저(크롬, 엣지, 파이어폭스, 사파리)에서 사용

 

 

 

Array - JavaScript | MDN

다른 프로그래밍 언어의 배열과 마찬가지로, Array 객체는 여러 항목의 컬렉션을 단일 변수 이름 아래 저장할 수 있고, 일반적인 배열 연산을 수행하기 위한 멤버가 있습니다.

developer.mozilla.org

 

'Today I Learned' 카테고리의 다른 글

[javascript] Array.concat()  (0) 2024.05.05
[javascript] Array.at()  (0) 2024.05.05
[javascript] Array.of()  (1) 2024.05.02
[javascript] Array.isArray()  (0) 2024.05.02
[javascript] Array.fromAsync()  (2) 2024.04.28