index
: 배열의 순서, 0번부터 시작한다.
element
: 배열의 요소이다.
length
: 배열의 길이를 구할 수 있다.arr.length
(index + 1)
arr[0]
: 배열의 첫번째 요소 예시
push
: 배열의 끝에 새로운 값을 추가한다.arr.push(추가할값)
pop
: 배열의 끝의 요소를 삭제한다.arr.pop()
let arr = [1, 3, 5]; console.log(arr[1]) // 3 arr[2] = 6; console.log(arr[2]) // 6
let arr = [[1, 2], [5, 6], [7, 8]]; console.log(arr[0]) // [1, 2] console.log(arr[0][0]) // 1 arr[0] = [3, 4]; console.log(arr[0]) // [3, 4]
let alphabet = [[['a','b'], ['c', 'd']], [['e', 'f'], ['g', 'h']]]; console.log(alphabet[1][0][1]) // f
for of :
for (let arr[i] of arr)
가for (let i = 0; i < arr.length; i += 1)
와 같다. (String
에서도 사용할 수 있다!)let test = [1, 2, 3, 4, 5] for (el of test) { console.log(test[el]) // 2, 3, 4, 5, undefined <- 잘못된 사용! } for (el of test) { console.log(el) // 1, 2, 3, 4, 5 <- 이렇게 접근해야 한다! }
for in : 객체에서 쓰인다! 배열에서도 되긴 된다!
let user = { name : 'jabe', age : '13', city : 'seoul' } for (key in user) { console.log(user[key]) // jabe, 13, seoul } for (el in test) { console.log(test[el]) // 1, 2, 3, 4, 5 } // 위의 예시를 가져와서 배열에 for in을 실행해도 되긴된다!
for (let i = 0; i < 5; i++)
을 응용하여 다양한 for문을 만들 수 있다.yes
yes
let str = "Hello"; let words = str.split('') console.log(words) // ['H', 'e', 'l', 'l', 'o'] <-배열로 바꿀 수 있다! let words = str.split() console.log(words) // ['Hello'] let words = str.split('e') console.log(words) // ['H', 'llo']
(" ")
로 문자열을 구분하여, 배열로 변경할 수 있다. str.split(" ").join(" ")
let str = "Hello"; let result1 = str.split("") console.log(result1) // ['H', 'e', 'l', 'l', 'o'] let result2 = result.join("") console.log(result2) // 'Hello' str.split("") // 이렇게 하면 console.log(str) //안 된다! 원본은 바뀌지 않기 때문이다.
(" ")
로 구분한 문자열로 변경할 수 있다.let str = ["Nice", "to", "meet", "you"] let result = str.join(" ") console.log(result) // 'Nice to meet you'
bracket notation
yes
slice(시작, 끝)
: 시작 인덱스부터 끝 익덱스 전까지 자른다. (접근자 메소드로 원본은 헤치지 않는다!)
splice(시작, 끝)
: 시작 인덱스부터 끝 익덱스까지 자른다. (변경자 메소드로 원본은 자르고 남은 것들이 남아있다.)
splice(시작, 제거수, 교체할값)
: 시작인덱스에 제거 수 1로 시작 인덱스 값을 바꾸거나, 제거수 0으로 시작 인덱스 뒤에 추가할 수 있다.let arr = ['a', 'b', 'c', 'd', 'e', 'f', 'g']; arr.slice(1, 5) // ['b', 'c', 'd', 'e'] console.log(arr) // ['a', 'b', 'c', 'd', 'e', 'f', 'g'] <- slice는 원본을 해치지 않는다! arr.splice(2, 6) // ['c', 'd', 'e', 'f', 'g'] console.log(arr) // ['a', 'b'] <- splice는 원본을 변화시킨다! arr.splice(1, 1, 'c') // .splice(시작인덱스, 제거할수, 교체할것) console.log(arr) // ['a', 'c'] <- 값을 바꿀 수도 있다! arr.splice(1, 0, 'b') console.log(arr) // ['a', 'b', 'c'] <- 값을 추가할 수도 있다!
Array.isArray
: 배열이면true
, 이외의 것이면false
를 내보낸다.typeof 배열 // 'object' typeof 객체 // 'object' Array.isArray(배열) // true Array.isArray(객체) // false
push
: 배열의 뒤에 추가한다.
unshift
: 배열의 앞에 추가한다.
pop
: 배열의 뒤에 삭제한다.
shift
: 배열의 앞에 삭제한다.let arr = ['b', 'c', 'd']; console.log(arr.push('e')) // 4가 나온다. 반환값이 length이다. console.log(arr) // ['b', 'c', 'd', 'e'] console.log(arr.unshift('a')) // 역시 5가 나온다! console.log(arr) // ['a', 'b', 'c', 'd', 'e'] arr.pop() // 'e'삭제된 값이 나온다. console.log(arr) // ['a', 'b', 'c', 'd'] arr.shift() // 'a' console.log(arr) ['b', 'c', 'd']
length
: 문자열처럼 배열에서도 사용할 수 있다!let arr = ['b', 'c', 'd']; console.log(arr.length) // 3
indexOf
: 찾는 요소의 인덱스 값을 반환한다. 존재하지 않다면-1
을 반환한다.
includes
: 찾는 요소가 있으면true
를, 없으면false
를 반환한다. (internet explorer에서는 호환되지 않는다!)let words = ['Happy', 'Sunny', 'Day']; words.indexOf('Sunny') // 1 words.includes('Happy') // true words.indexOf('day') // -1 <- 대소문자를 구분하니 조심하자! words.includes('happy') // false <- 역시 대소문자를 구분한다!
return arr.slice()
으로 바로 리턴해 주었는데 안됐다. 접근자 메소드로 원본을 해치지 않았던 것...! return arr.pop()
이렇게도 했었는데 마지막 요소를 반환한다. push
나unshift
는 길이를 반환하고. 알면 쉽게 풀 수 있는 문제지만 모르면 정말 헷갈릴 수 있는 메소드가 많은 것 같다. 정확하게 짚고 넘어가는 게 필요하다. 두루뭉슬하게 알지 말자!🔥.concat
으로도 배열 두 개를 이을 수 있다는 걸 알았다. arr1.concat(arr2)
이런 식으로! Math.max.apply(null, arr)
로 배열에서 최대값을 찾을 수 있다. 정말 다양한 메소드들...mdn
을 잘 찾아보고 대비해야겠다.