객체 지향 JavaScript — 배열 및 함수

https://www.amazon.com/John-Au-Yeung/e/B08FT5NT62에서 Amazon에서 내 책을 확인하십시오.

지금 http://jauyeung.net/subscribe/에서 내 이메일 목록을 구독하십시오.

JavaScript는 부분적으로 객체 지향 언어입니다.

JavaScript를 배우려면 JavaScript의 객체 지향 부분을 배워야 합니다.

이 기사에서는 배열과 함수를 살펴보겠습니다.

ES6 어레이 메소드

ES6에는 더 유용한 배열 방법이 추가되었습니다.

Underscore 및 Lodash와 같은 타사 라이브러리에서 이전에 제공한 것을 제공했습니다.

Array.from

Array.from 메서드를 사용하면 반복 가능한 객체와 반복 불가능한 배열과 유사한 객체를 배열로 변환할 수 있습니다.

예를 들어 document.querySelectorAll에서 반환된 NodeList를 배열로 변환하는 데 사용할 수 있습니다.

우리는 쓸 수있다:

const divs = document.querySelectorAll('div');
console.log(Array.from(divs));

그런 다음 배열을 얻습니다.

숫자 인덱스와 length 속성이 있는 객체를 배열로 변환할 수도 있습니다.

예를 들어 다음과 같이 작성할 수 있습니다.

const obj = {
  0: 'a',
  1: 'b',
  length: 2
};
console.log(Array.from(obj));

그리고 우리는 다음을 얻습니다.

["a", "b"]

Array.of를 사용하여 배열 만들기

Array.of 메서드를 사용하여 새 배열을 만들 수 있습니다.

예를 들어 다음과 같이 할 수 있습니다.

let arr = Array.of(1, "2", {
  obj: "3"
})

그런 다음 우리는 다음을 얻습니다.

[
  1,
  "2",
  {
    "obj": "3"
  }
]

하나 이상의 인수를 취하고 인수가 있는 배열을 반환합니다.

ES6 Array.prototype 메소드

배열 인스턴스에는 모두 더 많은 메서드가 추가되어 있습니다.

여기에는 다음과 같은 방법이 포함됩니다.”

Array.prototype.entries() 

Array.prototype.values() 

Array.prorotype.keys()

entries는 키-값 쌍 배열을 반환합니다.
values 값의 배열을 반환합니다.
keys는 키 배열을 반환합니다.

따라서 다음과 같이 작성할 수 있습니다.

let arr = ['a', 'b', 'c']
for (const index of arr.keys()) {
  console.log(index)
}

for (const value of arr.values()) {
  console.log(value)
}

for (const [index, value] of arr.entries()) {
  console.log(index, value)
}

keys 메서드로 인덱스를 기록합니다.

그리고 values 메소드로 값을 기록합니다.

및 index 및 value entries 방법.

또한 주어진 조건과 일치하는 배열의 첫 번째 항목을 찾을 수 있도록 find 및 findIndex 메서드를 추가했습니다.
find 일치하는 항목을 반환합니다.

그리고 findIndex는 일치하는 항목의 인덱스를 반환합니다.

예를 들어 다음과 같이 작성할 수 있습니다.

let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
console.log(numbers.find(n => n > 3));
console.log(numbers.findIndex(n => n > 3));

그런 다음 콘솔 로그에서 각각 4와 3을 얻습니다.

기능

Function 생성자를 사용하여 함수를 생성할 수 있습니다.

예를 들어 다음과 같이 작성할 수 있습니다.

const foo = new Function(
  'a, b, c, d',
  'return arguments;'
);

첫 번째 인수는 매개변수이고 두 번째 인수는 함수 본문입니다.

문자열로 함수를 생성하기 때문에 사용하는 것은 좋은 생각이 아닙니다. 즉, 보안 및 성능 문제가 발생할 수 있습니다.

함수 개체에는 constrictor 및 length 속성이 있습니다.
constructor 속성에는 Function 생성자여야 하는 함수를 생성한 생성자가 있습니다.

그리고 length 속성에는 함수가 기대하는 매개변수 수가 있습니다.

따라서 다음이 있는 경우:

function foo(a, b, c) {
  return true;
}
console.log(foo.length);
console.log(foo.constructor);

우리는 각각 3과 ƒ Function() { [native code] }를 얻습니다.

결론

Array.from 및 Array.from 메서드를 사용하여 배열을 만들 수 있습니다.

또한 다양한 방법으로 배열을 탐색할 수 있습니다.
Function 생성자는 함수를 만드는 데 사용하면 안 됩니다.