[JavaScript] split, slice, for of 문

1. 문자열 구분자로 자르기 (split)

문자열을 특정 구분자로 분할하기 위해 split함수를 사용한다.

var str = 'HTML,CSS,JavaScript';
var words = str.split(',');
// 결과 : ['HTML', 'CSS', 'JavaScript']

// words[0] : 'HTML'
// words[1] : 'CSS'
// words[2] : 'JavaScript'

• split("구분자 문자열")
  위 예시는 str의 배열을 ',' 구분자로 잘라서 배열로 만들었다.

var str = 'HTML,CSS,JavaScript';
var words = str.split(',', 2);
// 결과 : ['HTML', 'CSS']

• split("구분자 문자열", "최대 배열 크기")
  split 함수의 두 번째 인자에 최대 배열 크기를 지정하면 해당 배열 크기만큼만 결과를 반환한다.

https://gent.tistory.com/463

2. 배열 slice 사용

const numbers = [1, 2, 3, 4, 5];
// 양수 index    0, 1, 2, 3, 4
// 음수 index   -5,-4,-3,-2,-1

console.log(numbers.slice()); // index 0부터 추출(0, undefined, null 동일 동작)
// expected : [1, 2, 3, 4, 5];

console.log(numbers.slice(1)); // index 1부터 추출
// expected : [2, 3, 4, 5];

console.log(numbers.slice(-2)); // 마지막요소부터 마지막에서 두번째 요소까지 추출
// expected : [4, 5];

console.log(numbers.slice(99)); // 배열의 길이보다 클 경우 빈 배열
// expected : [];


console.log(numbers.slice(1, 4)); // index 1부터 index 4까지(index 4제외) 추출
// expected : [2, 3, 4];

console.log(numbers.slice(2, -1)); // index 2부터 마지막에서 첫번째 요소까지(마지막에서 첫번째 요소 제외) 추출
// expected : [3, 4];

console.log(numbers.slice(2, 99)); // index 2부터 마지막에서 요소까지 추출(end가 배열의 길이보다 큼)
// expected : [3, 4, 5];

여기서 생각해봐야 될 부분은 numbers.slice() 빈 공백으로 넣어두면 배열이 복사가 되는 얕은 복사가 된다는 점 이다.

https://tocomo.tistory.com/30

3. For of 문

for(const item of 이터러블){반복 수행 코드} 로 작성 한다.

const arr = [10, 20, 30];
for (const item of arr){
    console.log(item); // 10, 20, 30 출력
}

• 이터러블에는 String, Array, Map, Set, DOM컬렉션(HTMLColletion, NodeList) 등이 있다.

변수 안에 할당된 값을 다 가져와야 될 경우 for 을 사용 하는것 보다 for of문을 사용하는게 좀 더 간결하고 편한듯 하다.