[JavaScript]リソース構造

整列

// 배열 생성
let arr=[1,2,3]; // 대괄호 (가장 많이 쓰이는 방법임)
let arr = new Array('a','b','c');

arr.pop();      // 배열에서 마지막 원소을 제거한 후에 이를 리턴
arr.push(data); // 배열에 값을 추가함. 추가된 배열은 마지막 원소가 됨
arr.shift();    // 배열에서 처음 원소을 제거한 후에 이를 리턴
arr.unshift(data);  // 배열의 첫번째 원소에 값 삽입

arr.sort([sortfunc]);   // 배열을 정렬, 정렬 조건은 sortfunc로 할당 가능
arr.reverse();  // 원소들의 순서를 뒤집음

arr.splice(index, howmany, e1,..., eN); // 배열의 특정구간을 추출하거나, 특정구간에 특정 배열을 추가함
arr.slice(start, end);  // 배열의 원소 중 특정구간에 해당하는 것들을 추출

arr.forEach(function(item, index, array) {
  // To Do
}); // 주어진 함수를 배열 요소 각각에 대해 실행
arr.concat(arr1,arr2);  // 복수의 배열을 결합해서 리턴

arr.toString();   // 배열의 원소를 콤마로 구분한 문자열을 리턴
arr.join('');           // 배열의 원소를 결합해서 하나의 문자열로 리턴

arr.indexOf();  // 배열 안에서 찾으려는 값의 첫번째 index를 리턴, 없으면 -1
arr.lastIndexOf();  // 배열 안에서 찾으려는 값의 마지막 index를 리턴
arr.includes(); // 배열이 특정값을 포함하고 있는지의 여부 반환

Array.isArray(arr); // 배열인지 확인

// 배열 요소 순회
for (let i=0; i<arr.length; i++) // 가장 빠른 방법이고 오래된 브라우저와도 호환됩니다.
for (let item of arr) // 배열 요소에만 사용되는 모던한 문법입니다.
for (let i in arr) // 배열엔 절대 사용하지 마세요. 매우 느림

長さパーセント
配列生成時にlenght propertyがあります.lengthは配列内の要素の個数ではなく、最大のインデックス+1値です.

let fruits = [];
fruits[123] = "사과";

alert( fruits.length ); // 124

length propertyは書くことができます.

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

arr.length = 2; // 요소 2개만 남기고 잘라봅시다.
alert( arr ); // [1, 2]

arr.length = 5; // 본래 길이로 되돌려 봅시다.
alert( arr[3] ); // undefined: 삭제된 기존 요소들이 복구되지 않습니다.

オブジェクトからなる配列内の特定のオブジェクトの検索

let users = [
  {id: 1, name: "John"},
  {id: 2, name: "Pete"},
  {id: 3, name: "Mary"}
];

let user = users.find(item => item.id == 1);

alert(user.name); // John

filter

let users = [
  {id: 1, name: "John"},
  {id: 2, name: "Pete"},
  {id: 3, name: "Mary"}
];

// 앞쪽 사용자 두 명을 반환합니다.
let someUsers = users.filter(item => item.id < 3);

alert(someUsers.length); // 2

map

let lengths = ["Bilbo", "Gandalf", "Nazgul"].map(item => item.length);
alert(lengths); // 5,7,6

reduce

let arr = [1, 2, 3, 4, 5];
let result = arr.reduce((sum, current) => sum + current, 0);
alert(result); // 15

sort

let arr = [ 1, 2, 15 ];

arr.sort(); // 문자열 기준 정렬
alert(arr);  // 1, 15, 2

arr.sort((a, b) => a - b); // 숫자 기준 정렬
alert(arr);  // 1, 2, 15

iterable、類似配列

移植可能:Symbol.反復器forを実現しました...の使用可能なオブジェクト(ex、配列、文字列)
類似配列(array-like):インデックスと長さの単位を持つオブジェクトで、配列のように見えます.
メソッドnext()を実装して、イテレーションのオブジェクト{done:Boolean,value:any}を返す必要があります.ここでdone:trueは、繰返しが終了したことを示します.そうしないとvalueは次の値になります.

let range = {
  from: 1,
  to: 5,

  [Symbol.iterator]() {
    this.current = this.from;
    return this;
  },

  next() {
    if (this.current <= this.to) {
      return { done: false, value: this.current++ };
    } else {
      return { done: true };
    }
  }
};

for (let num of range) {
  alert(num); // 1, then 2, 3, 4, 5
}

push、popなどの方法はサポートされていません.小さいかわいい配列に似ているのは通常配列ではありません.

let arrayLike = { // 인덱스와 length프로퍼티가 있음 => 유사 배열
  0: "Hello",
  1: "World",
  length: 2
};
// Symbol.iterator가 없으므로 에러 발생
for (let item of arrayLike) {}

Array.from()で本物のArrayを作る

let arrayLike = {
  0: "Hello",
  1: "World",
  length: 2
};
let arr = Array.from(arrayLike);
alert(arr.pop()); // World 

オブジェクト

Object.keys(obj) // 객체의 키만 담은 배열을 반환합니다.
Object.values(obj) // 객체의 값만 담은 배열을 반환합니다.
Object.entries(obj) // [키, 값] 쌍을 담은 배열을 반환합니다.

for...inとは異なり、キー値に関連する組み込みメソッドの多くは、継承されたプロパティではなく、オブジェクト自体のプロパティのみに適用されます.

マッピング(Map)

マップ(Map)は、キーと値が格納されているため、オブジェクトと似ています.違いは、オブジェクトはキーでのみ文字列を使用でき、マッピングは複数のデータ型であってもよいことです.

let map = new Map() // 맵 생성

// map을 사용할 땐 map전용 메서드 set, get 등을 사용해야만 합니다.
map.set(key, value) // key, value 저장
map.get(key) // key에 해당하는 값을 반환, key가 없으면 undefined를 반환

map.has(key) // key의 존재유무 확인
map.delete(key) // key에 해당하는 값을 삭제
map.clear() // 맵 안의 모든 요소 제거
map.size // 요소의 개수 반환

map.keys() // 키 집합 반환
map.values() // 값 집합 반환
map.entries() // [키, 값] 집합 반환

// 객체를 맵으로 바꾸기
let map1 = new Map(Object.entries(obj));
// 맵을 객체로 바꾸기
let obj = Object.fromEntries(map.entries()); 

map.setが呼び出されるたびにマッピング自体が返されます.だから地図.スクリーンを設定できます.

map.set('1', 'str1')
  .set(1, 'num1')
  .set(true, 'bool1');

セット(Set)

(Set)は、重複が許されない値を含む特殊な集合です.キーのない値が3に格納されます.

let set = new Set(iterable) // 인자로 이터러블(주로 배열) 넣고 생성
set.add(value) // 값 추가, 자신 리턴
set.delete(value) // 값 제거, 성공 여부 리턴
set.has(value) // 값 존재유무 확인
set.clear() // 셋 안의 모든 요소 제거
set.size // 요소의 개수 반환

set.keys() // 값 집합 반환(맵과의 호환성을 위해 만듬)
set.values() // 값 집합 반환
set.entries() // [값, 값] 집합 반환