지적 코딩을 위한 매우 얕은 지식

Javascript/Js

JS 배열(1)

toy2508 2022. 6. 6. 18:01
반응형

1. 배열의 생성

  - 배열 리터럴 : 배열 요소를 대괄호 안에서 콤마로 구분한 리스트 형태

  - 분해 연산자 : ...를 써서 배열 리터럴 안에서 다른 배열 요소를 넣을 수 있음

  - Array() 생성자 :
      1) Array() 생성자를 써서 배열 생성
      2) 인자가 하나일때는 배열의 길이, 두개 이상일 때는 요소가 된다. 

  - Array.of() : 인자의 갯수와 상관없이 인자는 모두 배열 요소로 만든다.

  - Array.from() :

      1) 이터러블 객체나 배열 비슷한 개체를 받으면,  해당 객체의 요소로

          새 배열을 만들어 반환

      2) 두 번째 인자는 옵션사항이지만, 새 배열을 생성할 때 소스 객체의
           각 요소를 이 함수에 전달하고 반환 값을 배열에 저장 

// 배열 리터럴
let empty = []; // 요소가 없는 배열
let primes = [2,3,5,7,11]; // 숫자 요소가 다섯 개 있는 배열
let misc = [1.1, true, "a", ]; // 타입이 다른 요소
let base = 1024;
let table = [base, base+1, base+2, base+3];
let b = [[1, {x:1, y:2}], [2, {x:3, y:4}]];
let count = [1,,3] // 인덱스 0과 2 요소 존재, 1는 undefined 리턴
let undefs = [,,]; // 요소가 없지만 길이가 2인 배열

// 분해 연산자
let a = [1,2,3];
let b = [0, ...a, 4]; // b == [0,1,2,3,4]
// 깊은 복사
let original = [1,2,3];
let copy = [...original];
copy[0] = 0 // 사본을 수정해도 원본이는 영향이 없음
original[0] // --> 1
// 문자열 --> 단어로 분해
let digits = [..."0123"];
digits // --> ["0","1","2","3"];

// Array 생성자
let a = new Array; // 인자 없이 호출
let a = new Array(10); // 배열 길이를 나타내는 숫자 인자 하나로 호출
//생성자의 인자가 새 배열 요소
let a = new Array(5,4,3,2,1,"testing, testing");

// Array.of() 
Array.of() // --> []; 인자가 없는 배열
Array.of(10) // --> [10]; 숫자 인자 하나만 있어도 됨
Array.of(1,2,3) // --> [1,2,3]

2. 배열 요소 읽기와 쓰기

 - 배열 요소에 접근할 때는 [] 연산자를 사용
 - 배열은 객체의 한 종류이며, [] 배열 내에 인덱스를 통해서 값을 읽거나

    쓰는것이 가능하다. 인덱스는 숫자를 이루어져있지만 크게 보면 객체의
    프로퍼티의 이름과 같다
 - 배열의 요소의 갯수는 legth 프로퍼티를 통해서 얻을 수 있다.

let a = ["world"]; // 요소가 하나 있는 배열
let value = a[0]; // 인덱스 0을 읽는다.
a[1] = 3.14; // 인덱스 1에 씁니다.
let i = 2; 
a[i] = 3; // 인덱스 2에 쓴다.
a[i + 1] = "hello" // 인덱스 3에 쓴다.
a[a[i]] = a[0]; // 인덱스 0과 2을 읽은 다음, 인덱스 3에 쓴다.
a[-1.23] = true; // -1.23이라는 프로퍼티가 생긴다.
a["1000"] = 0; // 배열의 1001번째 요소
a[1.000] = 1; // 배열 인덱스 1, a[1] = 1;과 같음​

3. 성긴 배열

  - 성긴 배열은 인덱스가 연속적이지 않은 배열이다.

  - 성긴 배열의 length 프로퍼터 값은 요소 개수보다 크다.
  - Array() 생성자 사용 및 현재 배열 length보다 큰 인덱스 요소를
    할당하면 만들어진다.

let a = new Array(5); // 요소가 없지만 a.length 5입니다.
a = []; // 요소가 없고 legth가 0인 배열
a[1000] = 0; // 요소는 하나를 추가하지만 길이는 1001로 만드는 할당
let a1 = [,]; // 이 배열은 요소가 없고 길이는 1임
let a2 = [undefined]; // 이 배열에는 udnefined 요소가 하나 있음
0 in a1 // --> false : a1은 인덱스 0에 요소가 없음
0 in a2 // --> true: a2는 인덱스 0에 undefined 값이 있음

4. 배열 길이

  - length 프로퍼티의 값은 요소로 가득 찬 배열에서는 요소의 개수와 같다.
  - 가장 큰 인덱스보다 length 값은 크다.

  - length 값을 설정하면 해당 값만큼 배열 크기가 축소되면서 값이 삭제된다.

[].length // --> 0: 배열에 요소가 없음
["a","b","C"].length // --> 3: 가장 큰 인덱스는 2이고 길이는 3임

// length의 delete 기능
a = [1,2,3,4,5];  // 요소가 다석 개인 배열 생성
a.length = 3; // a는 이제 [1,2,3]이 된다.
a.length = 0; // 요소전체가 삭제, a는 []이다
a.length = 5; // 길이는 5지만 new Array[5]와 마찬가지로 요소가 없음
반응형

'Javascript > Js' 카테고리의 다른 글

JS 배열(3)  (0) 2022.06.18
JS 배열(2)  (0) 2022.06.10
JS 객체(3)  (0) 2022.06.05
JS 객체(2)  (0) 2022.06.01
JS 객체(1)  (0) 2022.05.29