[ES6] String에 추가된 메소드들

2019. 10. 20. 16:32Programming/모던 자바스크립트 개발을 위한 ES6 수강내용 정리

반응형

모던 자바스크립트 개발을 위한 ES6

이 포스팅은 인프런의 '모던 자바스크립트 개발을 위한 ES6 강좌'의 수강 내용을 바탕으로 정리한 내용입니다.

String에 추가된 문자열들

startsWith, endsWith

startsWith는 문자열이 어떤 문자열로 시작되는지 boolean형으로 반환해주는 메서드이다. 반대로 endsWith는 문자열이 어떤 문자열로 끝나는지 boolean형으로 반환해주는 함수이다. 두 메서드 모두 옵션으로 두 번째 파라메터인 startPosition, endPosition을 받는다. 다음은 ECMAScript2015에 명세된 startsWith의 내용이다.

21.1.3.21 String.prototype.startsWith ( searchString [ , position ] )
The following steps are taken:

#1. Let O be ? RequireObjectCoercible(this value).
#2. Let S be ? ToString(O).
#3. Let isRegExp be ? IsRegExp(searchString).
#4. If isRegExp is true, throw a TypeError exception.
#5. Let searchStr be ? ToString(searchString).
#6. Let pos be ? ToInteger(position).
#7. Assert: If position is undefined, then pos is 0.
#8. Let len be the length of S.
#9. Let start be min(max(pos, 0), len).
#10. Let searchLength be the length of searchStr.
#11. If searchLength + start is greater than len, return false.
#12. If the sequence of code units of S starting at start of length searchLength is the same as the full code unit sequence of searchStr, return true.
#13. Otherwise, return false.

NOTE 1
This method returns true if the sequence of code units of searchString converted to a String is the same as the corresponding code units of this object (converted to a String) starting at index position. Otherwise returns false.

NOTE 2
Throwing an exception if the first argument is a RegExp is specified in order to allow future editions to define extensions that allow such argument values.

NOTE 3
The startsWith function is intentionally generic; it does not require that its this value be a String object. Therefore, it can be transferred to other kinds of objects for use as a method.

4에서 searchString이 정규표현식인 경우에는 TypeError exception을 던진다. 즉, 정규표현식은 지원하지 않는다.
7에서 position값이 주어지지 않은 경우에는 기본값인 0으로 할당되어, 문자열의 처음부터 비교한다.\

다음은 ECAMScript2015에 명세된 endsWith의 내용이다.

21.1.3.6 String.prototype.endsWith ( searchString [ , endPosition ] )
The following steps are taken:

#1.Let O be ? RequireObjectCoercible(this value).
#2.Let S be ? ToString(O).
#3.Let isRegExp be ? IsRegExp(searchString).
#4.If isRegExp is true, throw a TypeError exception.
#5.Let searchStr be ? ToString(searchString).
#6.Let len be the length of S.
#7.If endPosition is undefined, let pos be len; else let pos be ? ToInteger(endPosition).
#8.Let end be min(max(pos, 0), len).
#9.Let searchLength be the length of searchStr.
#10.Let start be end - searchLength.
#11.If start is less than 0, return false.
#12.If the sequence of code units of S starting at start of length searchLength is the same as the full code unit sequence of searchStr, return true.
#13.Otherwise, return false.

NOTE 1
Returns true if the sequence of code units of searchString converted to a String is the same as the corresponding code units of this object (converted to a String) starting at endPosition - length(this). Otherwise returns false.

NOTE 2
Throwing an exception if the first argument is a RegExp is specified in order to allow future editions to define extensions that allow such argument values.

NOTE 3
The endsWith function is intentionally generic; it does not require that its this value be a String object. Therefore, it can be transferred to other kinds of objects for use as a method.

실행단계는 startsWith와 크게 다르지 않음을 알 수 있다.

includes

includes는 문자열 내에 인자로 주어진 문자열이 포함되어있는지를 boolean값으로 반환해주는 메서드이다. 역시 옵션으로 position 파라메터를 받으며, 주어지지 않았을 경우에는 기본값인 0으로 설정된다. 다음은 ECAMScript2015에 명세된 includes의 내용이다.

21.1.3.7 String.prototype.includes ( searchString [ , position ] )
The includes method takes two arguments, searchString and position, and performs the following steps:

#1.Let O be ? RequireObjectCoercible(this value).
#2.Let S be ? ToString(O).
#3.Let isRegExp be ? IsRegExp(searchString).
#4.If isRegExp is true, throw a TypeError exception.
#5.Let searchStr be ? ToString(searchString).
#6.Let pos be ? ToInteger(position).
#7.Assert: If position is undefined, then pos is 0.
#8.Let len be the length of S.
#9.Let start be min(max(pos, 0), len).
#10.Let searchLen be the length of searchStr.
#11.If there exists any integer k not smaller than start such that k + searchLen is not greater than len, and for all nonnegative integers j less than searchLen, the code unit at index k + j within S is the same as the code unit at index j within searchStr, return true; but if there is no such integer k, return false.

NOTE 1
If searchString appears as a substring of the result of converting this object to a String, at one or more indices that are greater than or equal to position, return true; otherwise, returns false. If position is undefined, 0 is assumed, so as to search all of the String.

NOTE 2
Throwing an exception if the first argument is a RegExp is specified in order to allow future editions to define extensions that allow such argument values.

NOTE 3
The includes function is intentionally generic; it does not require that its this value be a String object. Therefore, it can be transferred to other kinds of objects for use as a method.

3애서 searchString이 정규표현식인지 isRegExp를 이용하여 확인하며, 정규표현식일 경우에는 TypeError exception을 던진다. position이 주어지지 않은 경우에는 기본값인 0으로 설정한다.

위에서 서술한 문자열 메서드 startsWith, includes의 실행순서를 살펴보면 전체적으로 indexOf와 크게 다르지 않음을 알 수 있다. 다만 추가적인 코드의 작성이나 indexOf의 반환값을 이용하여 추가적인 비교구문을 하지 않게끔, 반환되는 값이 boolean인 것에 주목하자. 이러한 변화로 인해 코드의 량이 줄어들며, 좀 더 직관적으로 변화된다는 것을 알 수 있다.

let str = "Hello World";
const startSearchString = "Hello";
if(str.indexOf(startSearchString) == 0) {
    //ES5에서는 indexOf가 반환하는 index값을 비교해야 했다.
    console.log("str은 Hello로 시작됩니다!");
}

if(str.startsWith(startSearchString)) {
    //ES6에서는 startsWith를 사용하여, 직관적인 코드의 작성이 가능하다.
    console.log("str은 Hello로 시작됩니다!");
}

const endSearchString = "World";
if(str.indexOf(endSearchString, str.length-endSearchString.length) == 0) {
    //ES5에서는... 어휴 이게 뭐야...
    console.log("str은 World로 끝납니다!");
}

if(str.endsWith(endSearchString)) {
    //ES6에서는 endsWith를 사용하여, 직관적인 코드의 작성이 가능하다.
    console.log("str은 World로 끝납니다!");
}

[참고]:
ECMA-262, 21.1.3.21 String.prototype.startsWith
ECMA-262, 21.1.3.6 String.prototype.endsWith
ECMA-262, 21.1.3.7 String.prototype.includes

반응형