array, object

array

var car = ['소나타', 50000, 'white'];

console.log(car); // ['소나타', 50000, 'white']
car[0] = '아반떼';
console.log(car[0]); // '아반떼'
car[3] = '2022';
console.log(car); // ['아반떼', 50000, 'white', '2022']

• array 자료형은 [arr1, arr2, ...] 의 형태로 변수를 저장해 사용할 수 있다
• array 는 index 로 값을 저장/수정/출력할 수 있다
• array 는 순서가 있는 자료형으로, index 활용 및 배열 정렬, 자르기, 순서 바꾸기, 검색 등으로 활용할 수 있다

array 활용

car.sort(); // 값 정렬
car.slice(1,3); // 배열 index 1부터 3 전까지 자르기
car.push(x); // 배열 맨 뒤에 x 삽입

• 위와 같은 배열 조작 기본 함수들이 존재하며, 더 많은 함수는 검색해 사용할 수 있다

array.sort()

var arr = [7, 3, 5, 2, 40];
var products = [
    {id: 0, price: 5000},
    {id: 1, price: 3000},
    {id: 2, price: 4000}
];

arr.sort(); // 문자 오름차순 [2, 3, 40, 5, 7]

arr.sort(function(a, b) {
    return a - b // 오름차순 [2, 3, 5, 7, 40]
});

arr.sort(function(a, b) {
    return b - a // 내림차순 [40, 7, 5, 3, 2]
});

products.sort(function(a, b) {
    return a.price - b.price // array > obj value 기준으로 오름차순
});

• array.sort() 함수는 문자 기준 오름차순 정렬 해주는 함수이다
  - (참고) .sort()는 데이터 원형을 변형시킨다
• array.sort(function(a, b) {return a - b}) 의 동작 원리
  1. a, b는 array의 각 요소 값들이다
  2. return a - b 결과 값이 양수면 a를 오른쪽 정렬해준다
  3. return a - b 결과 값이 음수면 a를 왼쪽 정렬해준다
  4. 이 과정을 모든 array 요소에 대해 진행한다((7, 3), (7, 5), (7, 2), ... (2, 40))
• array > obj 형태의 데이터는 파라미터로 꺼내온 데이터(obj 자료형)의 value를 비교하여 정렬할 수 있다

array.filter()

var arr = [7, 3, 5, 2, 40];

var new_arr = arr.filter(function(a) {
    return a < 4 // 필터 조건식, [3, 2]
});

• array.filter() 함수는 return 조건식 에 맞는 값들만 필터링해서 반환해주는 함수이다
  - (참고) .filter()는 데이터 원형을 변형하지 않고 새로운 값을 반환하므로, 새 변수에 저장해 사용해야 한다

array.map()

var arr = [7, 3, 5, 2, 40];

var new_arr = arr.map(function(a) {
    return a * 10 // 연산식, [70, 30, 50, 20, 400]
});

• array.map() 함수는 모든 요소 값을 한 번씩 꺼내 주는 함수이다
  - (참고) .map()은 데이터 원형을 변형하지 않고 새로운 값을 반환하므로, 새 변수에 저장해 사용해야 한다
• map() 함수로 꺼낸 요소를 return 연산식을 활용하면 모든 요소에 같은 연산을 적용해줄 수 있다

object

var car = {name: '소나타', price: 50000};

console.log(car['name']); // '소나타'
console.log(car.name); // '소나타'
car.name = '아반떼';
console.log(car); // {name: 아반떼, price: 50000}

• object 자료형은 {key1: value1, key2: value2, ...} 의 형태로 키 & 변수를 저장해 사용할 수 있다
• object 는 변수['key'] or 변수.key 로 값을 저장/수정/출력할 수 있다
• object 는 순서가 없는 자료형으로, index를 사용할 수 없지만 key 값을 알면 갯수가 많은 자료형에서도 원하는 값을 추출하기 용이하다