VIDEO
동영상 수강 전 본문 내용 스캔.
동영상 수강 후 본문 내용 스캔.
목차
00:49 배열 개념. (※ 객체 vs 자료구조)
06:07 1. Array declaration
07:00 2. Index position
09:46 3. Looping over an array
16:51 4. Addition, Deletion, Copy
26:22 5. Searching
00:49
1. 객체 vs 배열
[객체]
토끼 (귀 2개, 먹는다, 뛴다)
당근 (비타민, 주황색)
[배열] ≒ 자료 구조의 일종.
토끼 종류끼리 묶음.
당근 종류끼지 묶음.
※ 토끼, 당근 함께 묶을 수 있으나, 비권장.
PS1. (검색・삽입・삭제・정렬)할 때, 속도 효율성 좋은 알고리즘 선택이 중요.
PS2. 배열 index (= 색인번호)는 0 부터 시작. 마지막 index는 arr .length - 1
06:07
1. Array declaration
'use strict';
// Array
// 1. Declaration
const arr1 = new Array();
const arr2 = [1, 2]; // 더 흔한 방법
07:00
2. Index position
// 2. Index position
const fruits = ['사과', '바나나'];
console.log(fruits); // (2) ['사과', '바나나']
console.log(fruits.length); // 2
console.log(fruits[0]); // 사과
console.log(fruits[1]); // 바나나
console.log(fruits[2]); // undefined
console.log(fruits[fruits.length - 1]; // 바나나
결과보기
09:46
3. Looping over an array
// 3. Looping over an array
// print all fruits
// a. for
for (let i = 0; i < fruits.length; i++) {
console.log(fruits[i]);
}
// b. for...of
for (let fruit of fruits) {
console.log(fruit);
}
// c. forEach (※ 3가지 방법 존재)
// c-1. 일반함수
fruits.forEach(function(fruit, index, array) {
console.log('he');
console.log(fruit);
console.log(fruit, index);
console.log(fruit, index, array); // 가능하긴 하나, 거의 안 씀.
});
// c-2. 화살표함수
fruits.forEach((fruit, index) => {
console.log(fruit, index);
});
// c-3. 화살표함수 축약형
fruits.forEach((fruit, index) => console.log(fruit, index));
fruits.forEach((fruit) => console.log(fruit));
결과보기
16:51
4. Addition, Deletion, Copy
console.clear();
// 4. Addition, Deletion, Copy
// [뒤]
// push : add an item to the end
fruits.push('딸기', '복숭아');
console.log(fruits); // ['사과', '바나나', '딸기', ' 복숭아']
// pop : remove an item from the end and return it.
// const popped = fruits.pop();
fruits.pop(); // ['사과', '바나나', '딸기']
fruits.pop(); // ['사과', '바나나']
console.log(fruits);
// [앞]
// unshift : add an item to the beginning
fruits.unshift('딸기','레몬');
console.log(fruits); // ['딸기', '레몬', '사과', '바나나']
// shift : remove an item from the beginning
fruits.shift();
console.log(fruits); // ['레몬', '사과', '바나나']
fruits.shift();
console.log(fruits); // ['사과', '바나나']
// note!! shift, unshift are slower than pop, push
// ∵ 기존 아이템의 자리 이동 작업까지 발생
// [색인번호]
// splice : remove an item by index position
fruits.push('딸기', '복숭아', '레몬');
console.log(fruits); // ['사과', '바나나', '딸기', '복숭아', '레몬']
/*
fruits.splice(1); // index 1부터 그 뒤는 모두 제거.
console.log(fruits); // ['사과']
*/
fruits.splice(1,1); // index 1부터 그 뒤는 모두 제거.
console.log(fruits); // ['사과', '딸기', '복숭아', '레몬']
fruits.splice(1,1,'청사과', '수박'); // 딸기 제거하고, 청사과・수박 추가.
console.log(fruits); // ['사과', '청사과', '수박', '복숭아', '레몬']
/*
fruits.splice(1,0,'청사과', '수박'); // 딸기 그대로 두고, 청사과・수박 추가.
console.log(fruits); // ['사과', '딸기', '청사과', '수박', '복숭아', '레몬']
*/
// [결합]
// concat : combine two arrays
const fruits2 = ['망고', '코코넛'];
const newFruits = fruits.concat(fruits2);
console.log(newFruits); // ['사과', '청사과', '수박', '복숭아', '레몬', '망고', '코코넛']
결과보기
PS. 이모지도 문자이므로, 배열값으로 사용 시, 작은따옴표로 묶어줘야 함.
26:22
5. Searching
// 5. Searching
// indexOf : find the index (※ 만야, 아이템 중복 시, 첫 번째 것만 출력)
console.log(fruits); // ["사과", "청사과", "수박", "복숭아", "레몬"]
console.log(fruits.indexOf('사과')); // 0
console.log(fruits.indexOf('수박')); // 2
console.log(fruits.indexOf('코코넛')); // -1
// includes
console.log(fruits.includes('수박')); // true
console.log(fruits.includes('코코넛')); // false
결과보기
// lastIndexOf
console.clear();
fruits.push('사과');
console.log(fruits);
console.log(fruits.indexOf('사과')); // 0
console.log(fruits.lastIndexOf('사과')); // 5
결과보기
