JavaScript - 배열 (4)

1. Slice와 Splice 메서드

(1) slice의 역할?

: 배열의 일부를 복사하는 방법

변수.slice(시작, 끝)

• 시작과 끝은 반드시 지정할 필요는 없음.

slice 예시 1

# 색깔에 대한 배열 설정.

let colors = ['red', 'blue', 'yellow' , 'green', 'orange', 'purple']

colors.slice(3)
> ["green", "orange", "purple"]

# 끝을 지정했을 경우

colors.slice(2,5)
> ["yellow", "green", "orange"]

# 인덱스를 음수로 적을 경우
# 배열의 끝에서부터 시작된다.

colors.slice(-3)
> ["green", "orange", "purpl"]

즉, 시작점은 포함하지만 정지점은 포함시키지 않는다.
인덱스가 음수일 경우에는 가져오고자 하는 갯수를 적으면 되며 배열의 맨끝에서 차례로 가져오게 된다.

(2) splice의 역할?

: 기존에 있는 요소들을 제거하거나, 대체하거나, 새로운 요소를 추가해준다.

변수.splice(시작점, 제거할 갯수, 대체할 인수)

splice 예시 1

# 색깔에 대한 배열 설정.

let colors = ['red', 'blue', 'yellow' , 'green', 'orange', 'purple']

# 요소 'orange' 제거하기

colors.splice(4,1)
> ["orange"]

colors
> ['red', 'blue', 'yellow' , 'green', 'purple']

# 요소 blue 와 yellow 사이에 'brown', 'navy' 추가하기

colors.splice(2,0, 'brown', 'navy')
> []

colors
> ["red", "blue", "brown", "naby", "yellow", "green", "purple]

2. 배열에서 이중등호 연산자와 삼중등호 연산자의 역할

바로 예시를 살펴보자

'hi' === 'h1'
> true

['hi', 'bye'] === ['hi', 'bye']
> false

[1] === [1]
> false

---

왜 문자열 과 배열 에서의 등호 연산자에 따른 결과의 차이의 이유가 뭘까?

javascript에서는 요소가 아무리 동일해도 전혀 신경쓰지 않는다.
우리 눈에는 보이지 않는 참조값이 메모리에 저장이 된다.
즉, 메모리에서 일정한 크기를 할당받은 배열의 번호가 생긴 것이나 다름이 없다.

[1,2,3] === [1,2,3]
> false

콘텐츠는 같으나 메모리에서 각기 다른 것을 참조한다.(배열에서 콘텐츠는 중요치 않다.)

# nums라는 변수에 배열을 저장.
let nums = [1,2,3]

let numsCopy = nums;

nums 
> [1,2,3]
numsCopy
> [1,2,3]

nums.push(4)
> 4

nums
> [1,2,3,4]

numsCopy
> [1,2,3,4]

numsCopy.pop()
>4

nums 
> [1,2,3,]
numsCopy
> [1,2,3]

nums === numsCopy
> true

결국 nums와 numsCopy는 같은 것을 참조하고 있다. (서로 연결되어 있음 = 메모리에 같은 참조값을 배정받았으므로.)

---

3. const + 배열

const는 재할당이 불가. (원주율곽 같이 변하면 안되는 것에 const를 설정해줘야 한다.

배열은 참조를 저장하는 것이다.
이 배열의 참조가 바뀌지 않는 한, 아무리 배열 속의 컨텐츠를 바꿔도 그 배열의 참조값에는 전혀 문제가 없다.