String.prototype

charAt

/**
 * String.prototype.charAt(index)
 *
 * index 위치에 해당하는 문자 반환
 */

 console.log('boseok'.charAt(0)); // b
 console.log('boseok'.charAt(1)); // o
 console.log('boseok'.charAt(2)); // s

charCodeAt

/**
 * String.prototype.charCodeAt(index)
 *
 * charAt과 유사하게, 해당 인덱스의 위치에 해당하는 문자의 UTF-16 코드를 반환
 */

 console.log("abc".charCodeAt(0)); //97
 console.log("abc".charCodeAt(1)); //98

codePointAt

/**
 * String.prototype.codePointAt(index)
 *
 * fromCodePoint와 반대되는 프로토타입 메소드
 */

var icons = '☃★♲';

console.log(icons.codePointAt(1)); //9733

console.log(String.fromCodePoint(9733)); //★

concat

/**
 * String.prototype.concat(...string)
 *
 * 파라미터의 string과 this문자열을 합쳐서 새로운 문자열을 반환한다.
 */

console.log("bo".concat(',', 'seok')); //bo,seok
console.log("bo" + ',' + 'seok'); //bo,seok

endsWith

/**
 *
 * String.prototype.endsWith(string[, length])
 * this문자열이 파라미터의 string으로 끝나는지 true, false로 리턴.
 * this문자열의 길이를 두번째파라미터인 length로 제한할수도있음.(옵션)
 */

console.log('boseok!'.endsWith('!')); // true
console.log('boseok!'.endsWith('!', 4)); // false

includes

/**
 * ES6 스펙
 * String.prototype.includes(searchString[, position])
 *
 * this문자열에서 searchString이 포함되어있으면 true, 아니면 false 리턴.
 * 두번째파라미터는 옵션인데, position에 해당하는 index부터 찾는다.
 *
 * 사실 이 메소드는 indexOf로 대체가 가능하긴하다.
 * 이 메소드가 나온이유를 추측해보면 당연히 편리성이다.
 *
 * 예를들면 아래와 같은 코드를 보자.
 *
 * const isIncludes = 'boseok'.indexOf('b');
 * if(isIncludes) {
 *  console.log('문자열 찾음');
 * } else {
 *  console.log('문자열 없음');
 * }
 *
 * 헷갈리쥬?
 * 문자열을 찾았는데 해당 인덱스가 0이라서, if가 true가 아니고, false에 해당하므로
 * 문자열이 없다고 콘솔에 찍히는데, 이런 사소한 실수를 범할수있기때문에, includes가 나온것이 아닌가..ㅎㅎ
 *
 * if에 -1같은걸 비교하는 로직이 들어가면 가독성이 살짝 불편해질수도있다.
 * 그래서 ES6환경에서는 includes를 선호한다.
 */

 console.log('boseok'.includes('b'));
 console.log('boseok'.includes('b', 1));

indexOf

/**
 *
 * String.prototype.indexOf(searchString[, fromIndex])
 *
 * this문자열에서 첫번째로 나타나는 searchString문자열을 찾고, 그 위치를 반환한다.
 * fromIndex옵션은 어디서부터 찾을지 위치를 정할수있다.
 *
 * 문자열이 없으면 -1 리턴
 */

console.log('boseok'.indexOf('b')); //0
console.log('boseok'.indexOf('b', 1)); //-1

lastIndexOf

/**
 *
 * String.prototype.lastIndexOf(searchValue[, fromIndex])
 *
 * indexOf와 유사하지만 뒤에서부터 찾는다는 점에서 다르다.
 * this문자열에서 마지막 searchString문자열을 찾고, 그 위치를 반환한다.
 * fromIndex옵션은 어디서부터 찾을지 위치를 정할수있다.
 *
 * 문자열이 없으면 -1 리턴
 */

console.log('boseokb'.lastIndexOf('b')); // 6

length

/**
 * length 프로퍼티는 해당 문자열의 길이
 */
console.log("abcd".length); //4
const boseok = "boseok";
for (let i = 0; i < boseok.length; i++) {
  console.log(boseok[i]);
}

localeCompare

/**
 * String.prototype.localeCompare(string)
 *
 * 문자열끼리 비교하는데, 문자열을 순서대로 비교하여 같으면 0을 리턴,
 * 뒤에있으면 양수, 앞에있으면 음수를 리턴한다.
 * 앞, 뒤의 기준이 명확하진않지만 UTF-16기준인듯하다.
 *
 * 사실 두번째, 세번째 파라미터도 있지만 내용이 많고 헷갈리기쉽다.
 * 공식문서를 참고할것
 *
 * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare
 */

var a = 'réservé';
var b = 'RESERVE';
var c = 'reserve';
var d = 'reserve';

console.log(a.localeCompare(b)); //1
console.log(c.localeCompare(b)); //-1
console.log(d.localeCompare(b)); //0

match

/**
 * String.prototype.match(regex)
 *
 * 파라미터는 정규식이다.
 * new RegExp() 를 넣어도 되고, /정규식/g 이런식으로 넣어도 된다.
 * /ab+c/i;
 * new RegExp('ab+c', 'i');
 * 같은 결과를 나타낸다.
 * ES6 에서는 new RegExp(/ab+c/, 'i'); 이렇게도 사용할수있다.
 * 두가지 방법이 있는이유는 생성자 방식은 어떤패턴을 사용할지 정확히 알수없는경우- 사용자입력 등으로 생성되어서, 런타임방식으로 컴파일되게 한다.
 * g라는 위치는 정규식을 문자로 나타냈을때의 flag인데,
 * 아래의 의미를 나타낸다. /식/gi 이런식으로 이어서쓴다.
g
global match; 일치하는 첫 번째 문자에서 멈추지 않고 전체에서 일치하는 모든 문자를 검색합니다.
i
ignore case(대소문자를 구별하지 않습니다.)
m
multiline; 시작 혹은 끝 문자 탐색(^ and $)이 다중행에 적용되도록 합니다.  (예로,  \n 혹은 \r로 개행된 각각의 라인 시작 혹은 끝 뿐만 아니라, 전체 입력 문자의 시작 혹은 끝에서 일치합니다.
y
sticky; matches only from the index indicated by the lastIndex property of this regular expression in the target string (and does not attempt to match from any later indexes).

 * 이 메소드를 이해하려면 정규식에 대한 이해가 먼저 필요하다.
 *
 * 문자열에 패턴이 매칭되면 배열에 일치하는 값을 담아서 리턴해준다.
 * 일치하는 문자열이 없으면 null을 반환한다.
 */


if('boseokA'.match(/[A-Z]/gim)){
  console.log('matched');
} else {
  console.log('not matched');
}

padEnd

/**
 * ES2017 스펙
 *
 * String.prototype.padEnd(int, string)
 *
 * 문자열에서 int-문자열길이만큼 string을 뒤에 붙여서 리턴한다.
 * string이 주어지지않았다면 ' '로 표기된다.
 */

const str = '100';
console.log(str.padEnd(4), ','); //'100,'
console.log(str.padEnd(4)); //'100 '
console.log(str.padEnd(2)); //'100'
console.log(str.padEnd(0)); //'100'
console.log(str.padEnd(-1)); //'100'

padStart

/**
 *
 * String.prototype.padStart(int, string)
 * padEnd와 같은건데, string을 앞에 붙인다는점에서만 다르다.
 *
 */
const str1 = '5';

console.log(str1.padStart(2, '0')); //'05'

repeat

/**
 * ES6 스펙
 * String.prototype.repeat(int)
 *
 * this문자열을 int번만큼 반복한 문자열을 리턴한다
 */

 console.log('boseok'.repeat(5)); //'boseokboseokboseokboseokboseok'

replace

/**
 * String.prototype.replace(string|regex, string|function)
 *
 * 첫번째 파라미터에 regex와 string을 넣는것의 활용차이는 this문자열에서 매칭되는 모든 문자열을 바꿀것인가 이다.
 * 정규식의 flag에 g옵션으로 replace하면 replaceAll과 같다.
 * 문자열을 넣으면 매칭되는 첫번째문자열만 바꿔치기한다.
 *
 * 두번째파라미터의 function을 넣을수도있다.
 *
 * 파라미터로는 순서대로 (찾는 문자열, 찾은 인덱스, 원래 문자열)이 넘어온다.
 * 여러번 찾으면 콜백이 여러번 실행된다. 두번째파라미터인 찾은 인덱스만 바뀜.
 */

console.log('boseok'.replace('boseok', '123')); //123
console.log('boseok'.replace('o', '123')); //b123seok
console.log('boseok'.replace(/o/g, '123')); //b123se123k
console.log('boseok'.replace(/o/g, (...a) => {
  console.log(a); //[ 'o', 1, 'boseok' ] and [ 'o', 4, 'boseok' ]
  return '123';
}));  //b123se123k

search

/**
 * String.prototype.search(regex)
 *
 * this문자열에서 정규식에 일치하는 첫번째 문자열을 찾아서 그 위치를 반환한다.
 * 못찾으면 -1 리턴
 *
 * indexOf와 거의 같지만 정규식으로 찾는다는점에서 다르다.
 */

 console.log('boseok'.search(/o/)); //1

slice

/**
 * String.prototype.slice(beginIndex[, endIndex])
 *
 * this문자열을 잘라서 리턴한다.
 * beginIndex가 this문자열길이 이상이면 빈문자열을 리턴한다.
 * 만약 음수를 넣는다면 this.문자열의 길이 -음수로 처리한다.
 * 양수를 넣으면 그 인덱스부터 끝까지의 문자열을 리턴한다.
 * 두번째파라미터를 넣는경우 어디까지 자를것인지 정할수있다.
 */

 const boseok = 'boseok';
 console.log(boseok.slice(-1)); //'k'
 console.log(boseok.slice(1)); //'oseok'
 console.log(boseok.slice(1, 3)); //'os'
 console.log(boseok.slice(6)); //''

split

/**
 * String.prototype.split(string[, limit])
 *
 * this문자열을 첫번째파라미터인 string으로 각각 잘라서 배열로 리턴한다.
 * 두번째 파라미터인 limit은 잘라진 배열의 길이를 제한할 수 있습니다.
 */
 console.log('boseok'.split('')); //[ 'b', 'o', 's', 'e', 'o', 'k' ]
 /**
  * 위의 예제에서 문자열을 간단하게 배열로 변경했습니다.
  * 하지만 이 방법은 좋지않습니다. UTF-16 codeunit기준으로 자르기때문이지요.
  * 아래의 끔찍한 결과를 확인해보시져!
  */
  console.log('𨭎'.split('')); //[ '�', '�' ]

/**
 *   아래의 방법들이 더 적절합니다.
 *  4개의 결과 모두 콘솔에 [ '𨭎', '1' ] 이 나올것입니다.
 * 제일 마지막 방법은 babel에 의해 트랜스파일링된 것입니다.
 */
 console.log(Array.from('𨭎1'));
 console.log([...'𨭎1']);
 console.log('𨭎1'.split(/(?=[\s\S])/u));
 console.log('𨭎1'.split(/(?=(?:[\0-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF]))/));

startWith

/**
 *
 * String.prototype.startWith(string[, position])
 *
 * this문자열이 첫번째파라미터로 주어진 string으로 시작하는지 판단해줍니다.
 * true, false리턴.
 *
 * position은 옵션인데, 주어지지않으면 0으로 시작하고, 주어지면
 * 해당하는 인덱스부터 찾기 시작합니다.
 */

console.log('boseok'.startsWith('b')); //true
console.log('boseok'.startsWith('bo')); //true
console.log('boseok'.startsWith('o')); //false
console.log('boseok'.startsWith('o', 1)); //true

static_fromCharCode

/**
 * String.fromCharCode(...number)
 *
 * UTF-16 포맷에 해당하는 문자열을 리턴
 *
 * 문자 하나를 UTF 16으로 변환하는것은 'a'.charCodeAt(0) 이런식으로 사용하면 된다.
 */

console.log(String.fromCharCode(97)); // a
console.log(String.fromCharCode(43)); // +

static_fromCodePoint

/**
 * fromCharCode 와 비슷하게, 해당 number에 해당하는 특수문자를 반환.
 * String.fromCodePoint(...number)
 */

 console.log(String.fromCodePoint(9733)); // ★

substring

/**
 * String.prototype.substring(startIndex[, endIndex])
 * 우선 substr은 deprecated입니다. 대신에 이 메소드를 사용하세요.
 * 기본적인 사용방법은 slice와 동일합니다.
 * 대신에 startIndex가 endIndex보다 크면 내부적으로 startIndex와 endIndex를 swap합니다. (slice는 그렇지않음)
 * 그리고 음수를 넣으면 차이점이 보입니다.
 */
console.log('boseok'.substring(0, 1)); //'b'
console.log('boseok'.substring(0)); //'boseok'

console.log('boseok'.substring(-1)); //'boseok'
console.log('boseok'.slice(-1)); //'k'
console.log('boseok'.substring(1, 0)); //'b'
console.log('boseok'.slice(1, 0)); //''

toLocaleLowerCase

/**
 * String.prototype.toLocaleLowerCase(option)
 *
 * this 문자열을 모두 소문자로 바꿔서 리턴합니다.
 * option파라미터로 locale을 정할수있는데, 여러개의 locale을 넣는다면,
 * best locale을 자동으로 선택한다고하네요.
 * 기본 locale은 해당호스트의 locale입니다.
 */

 console.log('BOSEOK'.toLocaleLowerCase('us')); //'boseok'

toLocaleUpperCase

/**
 * String.prototype.toLocaleUpperCase()
 * this 문자열을 모두 대문자로 바꿔서 리턴합니다.
 * option은 toLocaleLowerCase와 같습니다.
 */

console.log('boseok'.toLocaleUpperCase('us')); //'BOSEOK'

toLowerCase

/**
 * String.prototype.toLowerCase()
 *
 * this문자열을 모두 소문자로 바꿔서 만들어진 문자열을 리턴합니다.
 */

 console.log('BOSEOK'.toLowerCase()); //'boseok'

toString

/**
 * String.prototype.toString()
 *
 *
 */
const v1 = 'boseok'.toString();
const v2 = '123'.toString();
console.log(typeof v1, v1); //string 'boseok'
console.log(typeof v2, v2); //string '123'

var x = new String('BOSEOK');
console.log(typeof x, x.toString()); //object 'BOSEOK'

toUpperCase

/**
 * String.prototype.toUpperCase()
 *
 * this문자열을 모두 소문자로 바꿔서 만들어진 문자열을 리턴합니다.
 */

console.log('boseok'.toUpperCase()); //'BOSEOK'

trim

/**
 * String.prototype.trim()
 *
 * this문자열의 양끝(시작과 끝)에서 공백을 제거하고 새롭게 만들어진 문자열을 리턴합니다.
 * 유사한 trimRight, trimLeft도 있습니다.
 * trimStart, trimEnd도 있지만 node.js에서는 동작하지않습니다.
 */

 console.log('    boseok  '.trim()) //'boseok'
 console.log('    boseok  '.trimRight()) //'    boseok'
 console.log('    boseok  '.trimLeft()) //'boseok  '

valueOf

/**
 * String.prototype.valueOf()
 *
 * toString과 같습니다. 주로 js내부적으로 사용하기위해 만들어졌습니다.
 */

 const v1 = '123';
 console.log(typeof v1.toString());
 console.log(typeof v1.valueOf());