TIL-10, 배열, 객체

ᅳ남훈·2021년 8월 1일
0

다시 JS/Node를 학습하자.
그중에서 여러모로 쓰임새가 많은 배열, 객체에 대해서 학습하는 시간을 가져보자.


배열

배열은 대량의 정보를 보관하고 관리할 수 있다.

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

Array.isArray();
-> 인자가 배열인지 Boolean으로 판별한다.
// Array.isArray(arr) -> true;
// Array.isArray([1, 2]) -> true;
// Array.isArray(1, 2, 3) -> false;

arr.push();
-> 배열의 끝에 새로운 배열을 추가한다.
()에 원하는 값을 넣는다.
// arr.push(5) -> arr = [1, 2, 3, 4, 5];

arr.pop();
-> 배열의 마지막 값을 삭제한다.
// arr.pop(); -> arr = [1, 2, 3];

arr.unshift();
-> 배열의 앞에 새로운 배열을 추가한다.
// arr.unshift(0) -> arr = [0, 1, 2, 3, 4];

arr.shift();.
-> 배열의 첫번째 값을 삭제한다.
// arr.shift() -> arr = [2, 3, 4];

arr.indexOf();
-> 인자가 배열의 몇번째 index인지 알아낸다.
// arr.indexOf(2) -> 1;

arr.includes();
-> 인자가 배열에 들어있는지 Boolean으로 판별한다.
// arr.includes(1) -> true;
// arr.includes(9) -> false;

arr1.concat(arr2);
-> arr1 배열과 arr2 배열을 병합한다.

arr.slice();
-> 첫번째 인자부터 두번째 인자까지 (두번째 인자는 미포함)의 배열을 반환.
// arr.slice(2) -> arr = [3, 4];
// arr.slice(1, 3) -> [2, 3];
// arr.slice(-2) -> [3, 4];
// arr.slice(1, -1) -> [2, 3];

arr.splice();
-> 인자가 3개일때 : (첫번째 인자)번의 index자리부터
(두번째 인자)개의 index를 삭제하고,
세번째 인자를 넣는다.
// arr.splice(1, 0, 7) -> arr = [1, 7, 3, 4];
-> 인자가 2개일때 : (첫번째 인자)번의 index를 삭제하고,
그 뒤를 (두번째 인자)개 만큼 삭제한다. (두번째 인자 포함)
// arr.splic(2, 1) -> arr = [1, 2, 4];


객체

객체는 각각 다른 값을 가질 수 있지만 입력해야하는 데이터의 종류가
동일할 경우 유용하게 쓰일 수 있다.

  let user = {
    name: 'Kim namhun',
    email: 'skagns211@gmail.com',
    age: '29'

위와 같은 기본 구조를 가지는데,
좌측(name, email, age)키(key),
우측('Kim namhun', 'skagns211@gmail,com', '29')
값(value)이라고 불리며,
묶어서 키-값 쌍(key-value pair) 이라고 부른다.
키-값 쌍 사이콜론(:)으로 구분하고,
키-값 쌍 끼리쉼표(,)로 구분한다.

객체의 값을 사용하는 방법은 두 가지가 있다.

  1. Dot notation
    -> user.name; // 'Kim namhun'
    -> user.age; // '29'

  2. Bracket notation
    -> user['name']; // 'Kim namhun'
    -> user['age']; // '29'

Brakcet notation 안에 ' '문자열 형식으로 넣어주지 않으면,
변수로 취급한다.

ex)

  let user = {
    name: 'Kim namhun',
    age: '29'
  }
  function userInfo(obj, key) {
    return obj[key];
  }
// userInfo(user, age) -> '29';  
// userInfo(user, name) -> 'Kim namhun';
profile
가보자!

0개의 댓글