JUST GO
[공통] 배열 본문
배열
- 배열(Array)은 하나의 변수에 여러개의 값을 담기위해 사용한다.
- 특별한 선언 방법은 없고 다음과 같이, 대괄호를 이용하여 선언한다.
let someArray = []; // 인자가 없는 배열
3. 어떠한 배열이 가지는 각 인자는 콤마(,)로 구분하여 여러개를 적을 수 있고, 대괄호와 인덱스(Index) 번호를 이용하여 접근하고 인덱스 번호는 0번 부터 시작한다.
let fruits = ['사과', '바나나', '코코넛'];
console.log( fruits[0] ); // '사과'
console.log( fruits[1] ); // '바나나'
4. 속성(Properties)
- length : 해당 배열의 길이(원소의 개수)이다. 배열의 길이에서 1을 뺀 값은 항상 마지막 인덱스 번호이다.
5. 단순 메서드(함수)
- at(x) : 전달된 'x'값에 해당하는 인덱스의 값을 반환한다. 이는 어떠한 배열 'someArray' 에 대해 'someArray[x]'하는 것과 같다.
console.log(fruits[1]); // 바나나
console.log(fruits.at(1)); // 바나나
- concat(x) : Concatenate(이어 붙이다)의 줄임말로, 호출 대상이 되는 배열과 전달 인자인 배열 x를 이어붙인 새로운 배열을 반환한다. (새로운 배열이 생성된다.)
let badFoods = ['햄버거', '피자', '감자 튀김'];
let goodsFoods = ['비빔밥', '약밥', '돌나물'];
let foods = badFoods.concat(goodFoods);
console.log(badFoods); // ['햄버거', '피자', '감자 튀김']
console.log(goodFoods); // ['비빔밥', '약밥', '돌나물']
console.log(foods); // ['햄버거', '피자', '감자 튀김', '비빔밥', '약밥', '돌나물']
- includes(x) : 호출 대상이 되는 배열이 전달된 x를 포함하는가의 여부를 반환한다.
console.log(badFoods); // ['햄버거', '피자', '감자 튀김']
badFoods.includes('햄버거'); // true
badFoods.includes('짜장면'); // false
- indexOf(x) : 호출 대상이 되는 배열이 가지고 있는 인자 중 전달된 X와 일치하는 인자의 인덱스 번호를 반환한다. 일치하는 인자가 없다면 -1을 반환한다.
badFoods; // ['햄버거', '피자', '감자 튀김']
badFoods.indexOf('햄버거'); // 0
badFoods.indexOf('짜장면'); // -1
/*
badFoods.includes(x) 는 badFoods.includes(x) > -1와 같다.
*/
- join(x) : 호출 대상이 되는 배열이 가지고 있는 원소를 주어진 문자열 x 로 이어 붙인다. x 원소가 생략될 경우 공백으로 인식한다. x 인자가 생략될 경우 쉼표(,)로 인식한다. x는 각 원소 사이에 들어가며 첫번째 원소의 앞이나 마지막 원소의 뒤에 삽입되지 않는다.
cosole.log(badFoods); //['햄버거', '피자', '감자 튀김']
cosole.log(badFoods.join('랑 ') + '주세요.');
// 햄버거랑 피자랑 감자튀김 주세요.
- pop() : 호출 대상이 되는 배열이 가지고 있는 원소 중 마지막 원소를 반환하고 원래 배열에서 제거한다.
badFoods; // ['햄버거', '피자', '감자 튀김']
badFoods.pop(); // '감자 튀김'
badFoods; // ['햄버거', '피자']
badFoods.pop(); // '피자'
badFoods; // ['햄버거']
- push(x) : 호출 대상이 되는 배열 가장 마지막 자리에 새로운 원소 x를 추가한다.
badFoods; // ['햄버거', '피자', '감자 튀김']
badFoods.push('치킨');
badFoods; // ['햄버거', '피자', '감자 튀김', '치킨']
- reverse() : 호출 대상이 되는 배열이 가지고 있는 원소들의 순서를 뒤집고 그 배열을 반환한다. 내림차순 하는것이 아닌 단순히 순서만 뒤집는다는 점에 유의한다.
let nums = [3, 1, 5, 2, 7];
let reversedNums = nums.reverse();
nums; // [7, 2, 5, 1, 3]
reversedNums; // [7, 2, 5, 1, 3]
- shift() : 호출 대상이 되는 배열이 가지고 있는 원소 중 첫번째 원소를 반환하고 원래 배열에서 제거한다.
badFoods; // ['햄버거', '피자', '감자 튀김']
badFoods.shift(); // '햄버거'
badFoods; // ['피자', '감자 튀김']
badFoods.shift(); // '피자'
badFoods; // ['감자 튀김']
- 'slice(s, e)' : 호출 대상이 되는 배열이 가지는 원소들 중 일부를 가지는 새로운 배열을 반환한다.
- 's' 와 'e' 모두 전달할 경우 원본 배열이 가지는 원소의 인덱스를 기준으로 's' 부터 'e' 개의 원소들을 가지는 배열을 반환한다.
- 'e' 생략시 's'부터 끝까지의 원소를 가지는 새로운 배열을 반환한다.
- 's' 와 'e' 모두 생략시 원본 배열과 동일한 원소를 가지는 새로운 배열을 반환한다.
let days = ['월','화','수','목','금','토','일'];
let weekdays = days.slice(0, 5);
weekdays; // ['월', '화', '수', '목', '금']
- sort(x) : 호출 대상이 되는 배열이 가지는 원소를 오름 차순 정렬한 후 그 배열을 반환한다. 이 때 'x'는 정렬할 기준이되는 함수를 직접 구성할 수 있는데 여기서는 생략한다.
- 내림차순 정렬을 하고 싶은 경우 sort() 함수 호출 후 reverse() 함수를 호출하면 된다.
let nums = [3, 5, 1, 7, 2];
let sortedNums = nums.sort();
nums; // [1, 2, 3, 5, 7]
sortedNums; // [1, 2, 3, 5, 7]
- 내림차순
let nums = [3, 5, 1, 7, 2];
nums.sort().reverse();
// [7, 5, 3, 2, 1]
- splice(i, r, v) : 호출 대상이 되는 배열에 새로운 값 'v' 를 인덱스 'i' 에 해당하는 위치에 추가한다.
이 때 추가하기 전 배열의 원소 중 인덱스 'i' 를 가지는 원소를 포함, 'r' 개의 원소를 삭제한다.
- 이 때 'v'를 생략한다면 'splice' 함수는 원소를 삭제하기만 한다.
- splice 함수에 의해 삭제된 원소들은 새로운 배열로 반환된다.
- splice 함수에 의해 삭제된 원소가 없다면 빈 배열( [ ] )을 반환한다.
let days = ['월', '화', '수', '금', '풍', '토', '일'];
// 0 1 2 3 4 5 6
days.splice(3, 0, '목');
days; // ['월', '화', '수', '목', '금', '풍', '토', '일']
days.splice(5, 1);
days; // ['월', '화', '수', '목', '금', '토', '일']
6. 화살표 함수를 이용하는 메서드(람다, Lambda)
- every(f) : 호출 대상이 되는 배열이 가진 모든 원소가 주어진 논리값을 반환하는 함수 'f'에 대해 전부 참(true) 인가의 여부를 반환한다.
let nums = [1, 3, 5, 7, 9];
nums.every(x => x % 2 !== 0); // true
nums.every(x => x < 9); // false
- filter(f) : 호출 대상이 되는 배열이 가지는 모든 원소에 대해 주어진 논리값을 반환하는 주어진 함수 'f' 에 대해 참인 원소만을 가지는 새로운 배열을 반환한다.
let nums = [1, 2, 3, 4, 5, 6, 7, 8, 9];
let evenNums = nums.filter(x => x % 2 === 0);
let oddsNums = nums.filter(x => x % 2 > 0);
evenNums; // [2, 4, 6, 8]
oddNums; // [1, 3, 5, 7, 9]
- find(f) : 호출 대상이 되는 배열이 가지는 모든 원소에 대해 주어진 논리값을 반환하는 주어진 함수 'f' 에 대해 참인 첫번째 원소를 반환한다.
let nums = [2, 4, 5, 6, 7];
let foundOdd = nums.find(x => x % 2 > 0);
foundOdd; // 5
- findIndex(f) : 호출 대상이 되는 배열이 가지는 모든 원소에 대해 주어진 논리값을 반환하는 주어진 함수 'f' 에 대해 참인 첫번째 원소의 인덱스 번호를 반환한다. 해당하는 원소가 없으면 '-1'을 반환한다.
let nums = [2, 4, 5, 6, 7];
let foundOddIndex = nums.find(x => x % 2 > 0);
foundOddIndex; // 2 (원소값 5의 인덱스 번호가 2임으로)
- forEach(f) : 호출 대상이 되는 배열이 가지는 모든 원소에 대해 전달된 함수 'f' 를 단순히 실행한다. 이 때 인자인 'f' 함수는 반환 값을 가질 필요가 없으며 'forEach' 또한 별도로 반환하는 값이 없다.
let alphabets = ['a', 'b', 'c'];
alphabets.forEach( x => {
console.log(x);
});
// 'a'
// 'b'
// 'c'
- map(f) : 호출 대상이 가지는 원소 전체애 대해 전달된 함수인 인자 'f'의 계산 과정을 거친 새로운 배열을 반환한다.
- 호출 대상이되는 배열과 반환되는 배열의 길이는 반드시 같다.
let names = ['apple', 'banana', 'coconut'];
let nameLengths = names.map(x => x.length);
nameLengths; // [5, 6, 7]
- some(f) : 호출 대상이 되는 배열이 가진 모든 원소가 논리값을 반환하는 주어진 함수 'f'에 대해 한 개 이상이 참(true) 인가의 여부를 반환한다.
let nums = [2, 4, 5, 6, 8];
nums.some(x => x % 2 > 0); // true
nums.some(x => x < 0); // false
'JavaScript > 학습내용' 카테고리의 다른 글
[공통] 오브젝트 (1) | 2022.10.04 |
---|---|
[공통] 반복문 (1) | 2022.10.04 |
[공통] 이벤트 (1) | 2022.10.04 |
[공통] 멤버(Member) (1) | 2022.10.04 |
[공통] 요소 선택 (0) | 2022.10.04 |