2019. 10. 20. 16:32ㆍProgramming/모던 자바스크립트 개발을 위한 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
'Programming > 모던 자바스크립트 개발을 위한 ES6 수강내용 정리' 카테고리의 다른 글
[ES6] for ... of (0) | 2019.10.20 |
---|---|
[ES6] let과 const (0) | 2019.10.12 |