JavaScript | Array Methods 2
Array객체의 static methods와 mutator methods를 알아봤던 Array Methods 1에 이어서 이번에는 accessor methods에 대해 알아보겠습니다.
accessor methods는 저번에 봤던 mutator methods와는 상반되게 소위 getter의 역할을 하는 함수들을 일컫습니다. 때문에 accessor methods는 immutable하게 함수를 호출한 배열을 수정하지 않고 새로운 값이나 배열을 반환합니다.
Accessor Methods
Array.prototype.indexOf()Array.prototype.lastIndexOf()Array.prototype.includes()Array.prototype.concat()Array.prototype.slice()Array.prototype.filter()Array.prototype.join()Array.prototype.toString()
indexOf / lastIndexOf
Array.prototype.indexOf(searchElement[, fromIndex])
배열에서 처음으로 등장하는 searchElement의 위치를 반환합니다. 배열에 searchElement가 없다면 -1을 반환합니다.
Array.prototype.lastIndexOf(searchElement[, fromIndex])
배열의 뒤에서부터 처음으로 등장하는 (맨 마지막에 있는) searchElement의 위치를 반환합니다. 배열에 searchElement가 없다면 -1을 반환합니다.
fromIndex로 검색을 시작할 위치를 지정할 수 있습니다. 또한 fromIndex < 0일 경우 뒤에서 fromIndex번째에서 검색을 시작하는데 lastIndexOf()의 경우엔 fromIndex > 0일 때와 시작위치를 계산하는 방식이 동일하므로 fromIndex의 부호와 상관없이 같은 결과를 반환합니다.
let arr = [1, 2, 3, 1, 2, 3];
arr.indexOf(2); // 1
arr.lastIndexOf(2); // 4
arr.lastIndexOf(2, 2); // 1
arr.lastIndexOf(2, -2); // 1
includes
Array.prototype.includes(valueToFind[, fromIndex])
배열의 element 중에 valueToFind가 있다면 true를, 없다면 false를 반환합니다. fromIndex를 통해서 검색을 시작할 위치를 설정할 수 있으며 fromIndex < 0인 경우 this.length + fromIndex에서부터 검색을 시작합니다.
concat
Array.prototype.concat(value1[, value2[, ... [, valueN]])
value1, value2, … valueN을 합친 새로운 배열을 반환합니다.
단, value가 primitive type이라면 그 값을 복사하고 객체라면 reference를 복사한다는 점을 주의해야 합니다.
reference가 복사된 객체를 수정한다면 원본배열과 새 배열에 모두 반영되기 때문입니다.
또 push()와는 다르게 argument로 배열이 전달된다면 배열 자체가 들어가 중첩배열이 되는 것이 아니라 배열의 element가 순서대로 하나씩 덧붙인 결과가 나옵니다.
let arr = [1, 2, 3];
arr.concat(4, 5, 6); // [1, 2, 3, 4, 5, 6]
arr.concat([4, 5, 6]); // [1, 2, 3, 4, 5, 6]
arr.push([4, 5, 6]); // arr : [1, 2, 3, [4, 5, 6]]
slice
Array.prototype.slice(begin[, end])
[start, end) 구간의 element를 배열의 형태로 추출합니다.
begin과 end의 기본값은 배열의 시작과 끝입니다. 또 음수값이 전달되면 배열의 끝에서부터 입력된 값 번째의 인덱스로 계산합니다.
let arr0 = ['a', 'b', 'c', 'd'];
let arr1 = arr0.slice(); // arr1 : ["a", "b", "c", "d"]
arr0.slice(0, -1); // ["a", "b", "c"]
filter
Array.prototype.filter(callback(element[, index[, array]])[, thisArg])
callback은 배열의 각 element를 받아 boolean값을 반환하는 함수입니다. filter()는 callback 함수가 true를 반환하도록 하는 element만을 포함한 배열을 반환합니다.
element 뿐만 아니라 index와 array로 callback함수에 전달할 인덱스와 배열을 받을 수 있으며, thisArg는 this값을 전달해 줍니다.
[1, 2, 3, 4, 5, 6].filter(e => e % 2 === 0); // [2, 4, 6]
join
Array.prototype.join([separator])
String.prototype.split()과는 반대로 배열의 모든 element들을 합친 문자열을 반환합니다.
separator는 문자열로 합쳐지는 element 사이에 들어가며 아무 값도 입력되지 않았을 땐 element 사이에 ,가 들어갑니다.
let str = "How are you doing?"
let words = str.split(' '); // words : ["How", "are", "you", "doing?"]
words.join(); // "How,are,you,doing?"
words.join(' '); // "How are you doing?"
toString
Array.prototype.toString()
배열을 지정된 형식의 문자열로 반환합니다.
[1, 2, 3].toString(); // "1,2,3"
[1, 2, [3, 4], 5].toString(); // "1,2,3,4,5"
References
Back to top ↑
Leave a comment