Array method() 정리

 

`use strict`;

const arr = ['chan', 'mark', 'peter', 'andy', 'sh'];

// Array.prorotype.method()

---

 

 

 

1. length: number;

// 1. length: number;
// 배열 길이를 가져오거나 설정
// 0부터 시작
console.log('1. ' + arr.length);
// arr.forEach((name) => console.log(name));
for(let i = 0; i <= arr.length-1; i++) {
    console.log(arr[i]);
}

 

 

 

 

2. toString(): string;

// 2. toString(): string;
// 배열의 문자열 반환
// console.clear();
console.log('2. ' + arr.toString());

 

 

 

 

3. toLocaleString(): string;

// 3. toLocaleString(): string;
// 사용자의 문화권에 맞는 시간표기법으로 년, 월, 일, 시간을 리턴
// console.clear();

const day = new Date(1996, 0, 3, 1, 28, 35);// 1996년 1월 3일 1시 28분 35초
// Date(): 시간의 특정 지점을 나타냄
//         국제표준시로부터 지난 시간을 밀리초로 나타내는 유닉스 타임스탬프 사용
// new Date();
// new Date(value);
// new Date(dateString);
// new Date(year, monthIndex[, day[, hour[, minutes[, seconds[, milliseconds]]]]]);
// year: 년. 0부터 99는 1900부터 1999로 처리
// monthIndex: 월. 0은 1 ~ 11은 12월
// day: 일. 기본값 1
// hours: 시. 기본값 0은 자정
// minutes: 분. 기본값 0분
// seconds: 초. 기본값 0초
// milliseconds: 밀리초. 기본값 0밀리초

console.log(day.toLocaleDateString());// 1996년 1월 3일 목요일
console.log(day.toLocaleTimeString());// 오전 1:28:35
console.log(day.toLocaleString());// 1996년 1월 3일 목요일 오전 1:28:35

 

 

 

 

4. pop(): T | undefined;

// 4. pop(): T | undefined;
// array에서 마지막 요소를 제거하고 반환
// array가 비어있으면 정의되지 않은 상태로 반환되며 수정되지 않음
arr.pop();
console.log(arr); // sh pop()

 

 

 

5. push(...i

tems: T[]): number;

// 5. push(...items: T[]): number;
// 배열 끝에 새 요소를 추가하고 배열의 새 길이를 반환
// @param items 배열에 추가할 새 요소
arr.push('jeno');
console.log(arr);

 

 

 

 

6. concat(...items: ConcatArray<T>[]): T[];

   concat(...items: (T | ConcatArray<T>)[]): T[];

// 6. concat(...items: ConcatArray<T>[]): T[];
//    concat(...items: (T | ConcatArray<T>)[]): T[];
// 둘 이상의 배열을 결합
// 기존 배열을 수정하지 않고 새 배열 반환
// @param items 배열 끝에 추가할 추가 배열 또는 항목
const newMember = ['aa', 'bb', 'cc'];// 추가할 배열
const newArr = arr.concat(newMember);// 새 배열
console.log(newArr);

 

 

 

 

7. join(separator?: string): string;

// 7. join(separator?: string): string;
// mdn: 배열의 모든 요소를 연결해 하나의 문자열로 만듦
// 배열의 모든 요소를 지정된 구분 문자열로 구분하여 문자열에 추가
// @param separator 문자열의 배열 요소 중 하나와 다음 요소를 구분하는데 사용되는 문자열
// 생략할 경우 배열 요소는 쉼표로 구분됨
// console.clear();
console.log(arr.join());// 생략할 경우
console.log(arr.join(' '));
console.log(arr.join('-'));

 

 

 

 

8. reverse(): T[];

// 8. reverse(): T[];
// 배열의 순서를 반전시킴
// 첫 번째 요소는 마지막 요소가 되며 마지막 요소는 첫번째가 됨
const arr1 = ['one', 'two', 'three'];
console.log('reverse: ' + arr1.reverse());
// reverse() 한 값을 한 번 더 reverse()
const aReverse = arr1.reverse();
console.log('reverse: ' + aReverse);

 

 

 

 

9. shift(): T | undefined;

// 9. shift(): T | undefined;
// 배열에서 첫 번째 요소를 제거하고 제거된 요소를 반환
// 배열이 비어있으면 정의되지 않은 상태로 반환되고 배열은 수정되지 않음
// 배열의 길이를 변하게 함
console.log('shift() 전: ' + arr);
const firstElement = arr.shift();
console.log(firstElement); // 첫번째 요소 제거
console.log('shift() 후: ' + arr);

 

 

 

 

10. slice(start?: number, end?: number): T[];

// 10. slice(start?: number, end?: number): T[];
// 배열의 start부터 end(end미포함)까지에 대한 얕은 복사본을 새로운 배열 객체로 변환
// 원본 배열은 바뀌지 않음
// 시작과 끝 모두 음의 인덱스를 사용하여 배열 끝에서 오프셋을 나타낼 수 있음
// 예를들어 -2는 배열의 두 번째에서 마지막 요소
// @param start 배열의 지정된 부분의 시작 인덱스
// start가 정의되지 않은 경우는 index 0에서 slice()가 시작됨
// @param end 배열의 지정된 부분의 끝 인덱스. 끝 요소는 제외됨
// 끝이 정의되지 않는 경우 slice()가 배열 끝으로 확장됨
// console.clear();
const sliceArr = ['one', 'two', 'three', 'four','fiv'];
console.log(sliceArr);
console.log(sliceArr.slice(1, 3)); //index 1인 two부터 2까지의 값 출력(index 3번째인 end값은 출력하지 않음)
console.log(sliceArr.slice(2));// end값을 지정하지 않을 경우 index 2번부터 끝까지 출력

 

 

 

 

11. sort(compareFn?: (a: T, b: T) => number): this;

// 11. sort(compareFn?: (a: T, b: T) => number): this;
// Array 정렬, 반환
// @param compareFunction 
//        정렬 순서를 정의하는 함수
//        생략 시 배열은 각 요소의 문자열 변환에 따라 각 문자의 유니코드 코드 포인트 값에 따라 정렬
// 첫 번째 인수가 두 번째 인수보다 작으면 음수값을 반환
//      같으면 0 반환
//      그렇지 않으면 양수값 반환
//      생략하면 ASCII 오름차순으로 정렬
// [11,2,22,1].sort((a, b) => a - b)
// 반환 시 복사본이 만들어지는 것이 아님. 원 배열이 정렬됨
const months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort();
console.log(months);// ABCD 순서대로 정렬됨

const sortArr = [1, 23, 4, 100, 75];
sortArr.sort();
console.log(sortArr);// 가장 앞 숫자의 순서대로 정렬

 

 

 

 

12. splice(start: number, deleteCount?: number): T[];

// 12. splice(start: number, deleteCount?: number): T[];
// 배열의 기존 요소를 삭제 또는 교체하거나
// 새 요소를 추가하여 배열의 내용 변경
// @param start 요소 제거를 시작할 배열. 0 기반 위치
// @param deleteCount 제거할 요소의 수
// @return 삭제된 요소를 포함하는 배열을 반환
// console.clear();
const spliceArr = ['Jan', 'March', 'April', 'June'];
spliceArr.splice(1, 0, 'Feb'); // index 1 자리에 아무것도 지우지 않고 'Feb' 추가
console.log(spliceArr);

spliceArr.splice(4, 1, 'May');// index 4 자리에 한 개 지우고 그 위치에 'May' 추가
console.log(spliceArr);

 

 

 

 

13. unshift(...items: T[]): number;

// 13. unshift(...items: T[]): number;
// 배열 시작 부분에 새 요소 추가, 새 길이 반환
// @param items 배열 시작 부분에 삽입할 요소
// console.clear();
const unshiftArr = [1, 2, 3]; 
console.log(unshiftArr.unshift(0)); // length를 출력
console.log(unshiftArr); // 이렇게 해야 추가된 값 포함 출력

 

 

 

 

14. indexOf(searchElement: T, fromIndex?: number): number;

// 14. indexOf(searchElement: T, fromIndex?: number): number;
// 배열 내 요소의 최초의 인덱스, 없는 경우 -1 반환
// @param searchElement 배열에서 찾을 값
// @param fromIndex 검색을 시작할 색인. 제공된 색인이 음수이면 앞에서 뒤로 검색. 
//                  계산된 인덱스가 0보다 작으면 전체 배열 검색. 기본값: 0 (전체 배열 검색)
const indexOfArr = ['ant', 'bison', 'camel', 'duck', 'bison'];
console.log(indexOfArr.indexOf('bison'));
console.log(indexOfArr.indexOf('bison', 2)); // 뒤에서부터 검색?
console.log(indexOfArr.indexOf('giraffe'));// 없는 값은 -1

 

 

 

 

15. lastIndexOf(searchElement: T, fromIndex?: number): number;

// 15. lastIndexOf(searchElement: T, fromIndex?: number): number;
// 배열 내 요소가 마지막으로 발생한 인덱스, 없는 경우 -1 반환
// @param searchElement 배열에서 찾을 값
// @param fromIndex 배열 탐색은 fromIndex에서 시작하여 뒤로 진행
const lastIndexOfArr = ['Dodo', 'Tiger', 'Penguin', 'Dodo'];
console.log(lastIndexOfArr.lastIndexOf('Dodo'));
console.log(lastIndexOfArr.lastIndexOf('Tiger'));

 

 

 

 

16. every<S extends T>(predicate: (value: T, index: number, array: T[]) => value is S, thisArg?: any): this is S[];

     every(predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any): boolean;

// 16. every<S extends T>(predicate: (value: T, index: number, array: T[]) => value is S, thisArg?: any): this is S[];
//     every(predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any): boolean;
// 배열 안의 모든 요소가 주어진 판별 함수를 통과하는지 테스트
// 빈 배열에서 호출하면 무조건 true 반환
// callback이 거짓을 반환하는 요소를 찾을 때까지 배열에 있는 각 요소에 대해 한 번씩 callback 함수 실행
// 거짓 발견 시 즉시 false 반환
// @param predicate 최대 세 개의 인수를 허용. 처리할 현재 요소
//        + index 처리할 현재 요소의 인덱스
//        + array every를 호출한 배열
// @param thisArg callback을 실행할 때 this로 사용하는 값. 그 외엔 undefined 값 사용
//                Arg가 생략되면 정의되지 않은 값이 이 값으로 사용하게 됨
// 반환값: callback이 모든 배열 요소에서 참인 값을 반환하는 경우 true, 그 외 false
const isBelowThreshold = (currentValue) => currentValue < 40; // 조건 제시
const everyArr = [1, 30, 39, 22, 14, 25];
console.log(everyArr.every(isBelowThreshold));// everyArr 변수에 조건 대입

 

 

 

 

17. some(predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any): boolean;

// 17. some(predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any): boolean;
// 배열 안의 요소가 주어진 판별 함수를 통과하는지 테스트
// 빈 배열에서 호출하면 무조건 false
// @param predicate 최대 세 개의 argument를 허용
// @param thisArg 이 키워드가 predicate function에서 참조할 수 있는 개체
//                이 Arg가 생략되면 정의되지 않은 값이 이 값으로 사용됨 
console.clear();
const someArr = [1, 2, 3, 4, 5];

const even = (element) => element % 2 === 0;

console.log(someArr.some(even));

 

 

 

18. forEach(callbackfn: (value: T, index: number, array: T[]) => void, thisArg?: any): void;

 

 

 

 

19. map<U>(callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): U[];

 

 

 

 

20. filter<S extends T>(predicate: (value: T, index: number, array: T[]) => value is S, thisArg?: any): S[];

     filter(predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any): T[];

 

 

 

 

21. reduce(callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T): T;

     reduce(callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T, initialValue: T): T;

     reduce<U>(callbackfn: (previousValue: U, currentValue: T, currentIndex: number, array: T[]) => U, initialValue: U): U;

 

 

 

 

22. reduceRight(callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T): T;

    reduceRight(callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T, initialValue: T): T;

    reduceRight<U>(callbackfn: (previousValue: U, currentValue: T, currentIndex: number, array: T[]) => U, initialValue: U): U;