자바스크립트에서 문자열은 문자 배열과 겉모습은 닮았지만 배열이 아니다.

const str = "foo";
const arr = ["f", "o", "o"];

str[1]  // "o"
arr[1]  // "o"

 

문자열과 문자 배열의 차이 중 하나로 위의 코드와 같이 문자열의 특정 문자를 접근할 때

배열과 같이 a[1]이라고 접근하는 것은 모든 자바스크립트 버전에서 유효한 것은 아니다.

일부 구버전 IE에서는 undefined를 반환한다.

정확하게는 a.charAt(1) 으로 접근해야한다.

 

문자열과 문자 배열의 가장 중요한 차이는 

문자열은 불변 값이지만, 배열은 가변 값이라는 것이다.

 

문자열은 불변 값이므로 문자열 메서드는 해당 문자열 내용을 변경하지 않고

항상 변경된 새로운 문자열을 생성해 반환한다.

즉 원래의 문자열 값은 변하지 않는 것이다.

 

반면 대부분의 배열 메서드는 원래의 배열 값을 변경한다.

const bigStr = str.toUpperCase();

str; // "foo" 원래 값이 변하지 않음
bigStr; // "FOO"

arr.push("!");
arr;  // ["f", "o", "o", "!"] 원래 값이 변함

 

배열 메서드 중에서도 원래 배열의 값을 변화시키지 않는 

일부 불변 배열 메서드는 문자열이 빌려서 사용할 수 있다.

str.join;  // undefined
str.map;  //undefined

const joinStr = Array.prototype.join.call(a, "-");
const mapStr = Array.prototype.map.call(a, c => 
               c.toUpperCaser() + ".")
               .join("");

joinStr;  // "f-o-o"
mapStr;  // "F.O.O."

 

만약 가변 배열 메서드를 사용하고 싶으면

문자열을 배열로 바꾸고 원하는 작업을 수행한 후 다시 문자열로 되돌리는 방법이 있다.

const reverseStr = str
    // str을 배열로 분해
    .split("")
    // 문자 배열의 순서를 거꾸로 뒤집음
    .reverse()
    // 문자 배열을 합쳐 다시 문자열로 만듬
    .join("");

reverseStr; // oof

 

만약 문자열 자체에 어떤 작업을 빈번하게 수행하는 경우라면

문자열을 배열로 취급하여 작업하는 것이 효율적일 수 있다.

 

https://github.com/getify/You-Dont-Know-JS

 

getify/You-Dont-Know-JS

A book series on JavaScript. @YDKJS on twitter. Contribute to getify/You-Dont-Know-JS development by creating an account on GitHub.

github.com

'Javascript' 카테고리의 다른 글

자바스크립트 배열  (0) 2019.12.29
선언되지 않은 변수  (0) 2019.12.14
자바스크립트 내장 타입  (0) 2019.12.14

+ Recent posts