자바스크립트 학습 23일차

# 자바스크립트 학습

# 엘리먼트 복사

## slice()

구분	데이터(값)
data	대상
파라미터	시작 인덱스, 디폴트: 0
	끝 인덱스opt, 디폴트: length
반환	[결괴]

• 배열의 일부를 복사하여 배열로 반환한다.
• 첫 번째 파라미터의 인덱스부터, 두 번째 파라미터의 인덱스 직전까지 반환한다.

var origin = [1, 2, 3, 4, 5];
var result = origin.slice(1, 3);
log(result);
log(origin);

=>
[2, 3]
[1, 2, 3, 4, 5]

• true, false를 숫자로 변환한다.

var value = [1, 2, 3, 4, 5];
log(value.slice(true, 3));
log(value.slice(false, 3));

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

• 첫 번째 파라미터만 작성한 경우

log([1, 2, 3, 4, 5].slice(2));

=>
[3, 4, 5]

• 첫 번째 파라미터 값이 클 경우

var([1, 2, 3, 4, 5].slice(4, 3));

=>
[]

• 파라미터에 음수를 작성한 경우

var value = [1, 2, 3, 4, 5];
log(value.slice(-4, -2));

=>
[2, 3]

 

# 엘리먼트 값을 문자열로 변환

## join()

구분	데아터(값)
data	기준
파라미터	분리자opt, 디폴트 : 콤마(,)
반환	연결한 문자열

• 엘리먼트와 분리자를 하나식 결합하여 문자열로 연결한다.

[0] 인덱스, 분리자, [1] 인덱스, 분리자 .. 의 형태로

• 마지막 엘리먼트는 분리자를 연결하지 않는다.

var value = [1, 2, 3];
var result = value.join("##");
log(result);
log(typeof result);

=>
1##2##3
string

• 파라미터를 작성하지 않으면 콤마로 분리한다.

var value = [1, 2, 3];
var result = value.join();
log(result);

=>
1, 2, 3

• 파라미터에 빈 문자열 작성

var value = [1, 2, 3];
var result = value.join("");
log(result);

=>
123

엘리먼트 값만 연결하여 반환.
사용 빈도수가 높다.
<table>을 만들 때 주로 사용

## toString()

구분	데이터(값)
data	변환 대상
파라미터	사용하지 않음
반환	변환한 값

• 배열의 엘리먼트 값을 문자열로 연결한다.
• 콤마로 엘리먼트를 구분한다.

var result = ["A", "B", "C"].toString();
log(result);
log(["가"], ["다"]].toString());

=>
A, B, C
가, 다

## toLocaleString()

구분	데이터(값)
data	변환 대상
파라미터	사용하지 않음
반환	변환한 값

• 엘리먼트 값을 지역화 문자로 변환한다.
• 문자열을 콤마로 연결하여 반환한다.

var value = [12.34, 56];
log(value.toLocaleString("zh-Hans-CN-u-nu-hanidec"));

=>
一二.三四, 五六

 

# 엘리먼트 삭제

## shift()

구분	데이터(값)
data	대상
파라미터	사용하지 않음
반환	삭제한 엘리먼트

• 배열의 첫 번째 엘리먼트를 삭제한다.
• 삭제한 엘리먼트 값이 undefined로 남지 않고 완전히 삭제된다.
• length의 값이 하나 줄어 든다.

var value = [1, 2, 34];
log(value.shift());
log(value);

=>
1
[2, 34[

• 빈 배열이면 undefined가 반환 된다.

var result = [].shift();
log(result);

=>
undefined

## pop()

구분	데이터(값)
data	대상
파라미터	사용하지 않음
반환	삭제한 엘리먼트

• 배열의 마지막 엘리먼트를 삭제한다.
• 삭제한 엘리먼트 값이 undefined로 남지 않고 완전히 삭제된다.
• length 값이 하나 줄어 든다.

var value = [1, 2, 34];
log(value.pop());
log(value);

=>
34
[1, 2]

• 빈 배열이면 undefined를 반환한다.

var result = [].pop();
log(result);

=>
undefined

## splice()

구분	데이터(값)
data	대상
파라미터	시작 인덱스, 디폴트: 0
	삭제할 엘리먼트 수
	추가할 엘리먼트: [item1 [, ...]]]opt
반환	[결과]

• 엘리먼트를 삭제하고 삭제한 엘리먼트를 반환한다.

var value = [1, 2, 3, 4, 5];
log(value.splice(1, 3));
log(value);

=>
[2, 3, 4]
[1, 5]

• 삭제한 위치에 세 번째 파라미터를 삽입한다.

var value = [1, 2, 3, 4, 5];
log(value.splice(1, 3, "A", "B"));
log(value);

=>
[2, 3, 4]
[1, A, B, 5]

• 파라미터를 작성하지 않으면 삭제하지 않는다.

var value = [1, 2, 3, 4, 5];
log(value.splice());
log(value);

=>
[]
[1, 2, 3, 4, 5]