>

01. 문자열 : 문자열 결합 / 템플릿 문자열

템플릿 문자열은 내장된 표현식을 허용하는 문자열 리터럴이다.

번호 기본값 메서드 리턴값
// 01번
const str1 = "자바스크립트";
const str2 = "제이쿼리";

document.querySelector(".sample01_N1").innerHTML="1";
document.querySelector(".sample01_Q1").innerHTML="자바스크립트, 제이쿼리";
document.querySelector(".sample01_M1").innerHTML="문자열(string) 결합";
document.querySelector(".sample01_P1").innerHTML=str1 +" "+str2;

// 02번
const num1 = 100;
const num2 = 200;

document.querySelector(".sample01_N2").innerHTML="2";
document.querySelector(".sample01_Q2").innerHTML="100, 200";
document.querySelector(".sample01_M2").innerHTML="숫자(number) 결합";
document.querySelector(".sample01_P2").innerHTML=num1 +" "+num2;

// 03번
const text1 = "모던";
const text2 = "자바스크립트";
const text3 = "핵심";

document.querySelector(".sample01_N3").innerHTML="3";
document.querySelector(".sample01_Q3").innerHTML="모던, 자바스크립트, 핵심";
document.querySelector(".sample01_M3").innerHTML="문자열(string) 결합";
document.querySelector(".sample01_P3").innerHTML="나는 " + text1 +"(modern) "+ text2 +"(javascript) "+ text3 + "을 배우고 싶다.";
document.querySelector(".sample01_N4").innerHTML="4";
document.querySelector(".sample01_Q4").innerHTML="모던, 자바스크립트, 핵심";
document.querySelector(".sample01_M4").innerHTML="템플릿 문자열";
document.querySelector(".sample01_P4").innerHTML=`나는 ${text1}(modern) ${text2}(modern) ${text3}(modern)`;

02. 문자열 메서드 : 변경 : toUpperCase() : 문자열을 대문자로 변경 : 반환(문자열)

toUpperCase는 문자열을 대문자로 변경하고, toLowerCase는 문자열을 소문자로 변경

번호 기본값 메서드 리턴값
const str1 = "javascript";
const currentStr1 = str1.toUpperCase();

document.querySelector(".sample02_N1").innerHTML="1";
document.querySelector(".sample02_Q1").innerHTML="javascript";
document.querySelector(".sample02_M1").innerHTML="toUpperCase()";
document.querySelector(".sample02_P1").innerHTML=currentStr1;
            
const str2 = "JAVASCRIPT";
const currentStr2 = str1.toUpperCase();

document.querySelector(".sample02_N2").innerHTML="2";
document.querySelector(".sample02_Q2").innerHTML="JAVASCRIPT";
document.querySelector(".sample02_M2").innerHTML="toLowerCase()";
document.querySelector(".sample02_P2").innerHTML=currentStr2;

03. trim() : 문자 / trimStart() / trimEnd() :

문자열의 공백을 제거해주는 메서드 입니다.

번호 기본값 메서드 리턴값
const str1 = "         javascript         ";
const currentStr1 = str1.trim();

document.querySelector(".sample03_N1").innerHTML="1";
document.querySelector(".sample03_Q1").innerHTML=str1;
document.querySelector(".sample03_M1").innerHTML="trim()";
document.querySelector(".sample03_P1").innerHTML=currentStr1;

const str2 = "         javascript         ";
const currentStr2 = str2.trimStart();

document.querySelector(".sample03_N2").innerHTML="2";
document.querySelector(".sample03_Q2").innerHTML=str2;
document.querySelector(".sample03_M2").innerHTML="trimStart()";
document.querySelector(".sample03_P2").innerHTML=currentStr2;

const str3 = "         javascript         ";
const currentStr3 = str3.trimEnd();

document.querySelector(".sample03_N3").innerHTML="3";
document.querySelector(".sample03_Q3").innerHTML=str3;
document.querySelector(".sample03_M3").innerHTML="trimEnd()"
document.querySelector(".sample03_P3").innerHTML=currentStr3;

04. slice() : 문자 / substring() / substr() :

문자열에서 원하는 값을 추출하여 문자열을 반환하는 메서드입니다.

1. "문자열".slice(시작위치)
2. "문자열".slice(시작위치, 끝나는 위치)
3. 시작 위치는 문자열을 뽑아내야 하기 떄문에 시작위치는 끝나는 위치보다 숫자가 작아야 한다
4. substring() 시작값이 끝나는 값보다 클 경우 두 값을 바꿔서 처리(에러 방지)
5. "문자열".substr(시작위치)
6. "문자열".substr(시작위치, 길이)
const str1 = "javascript refrence"
const currentStr1 = str1.slice(0);  //javascript reference
const currentStr2 = str1.slice(1);  //avascript reference
const currentStr3 = str1.slice(2);  //vascript reference
const currentStr4 = str1.slice(0, 1);  //j
const currentStr5 = str1.slice(0, 2);  //ja
const currentStr6 = str1.slice(0, 3);  //jav
const currentStr7 = str1.slice(1, 2);  //a
const currentStr8 = str1.slice(1, 3);  //av
const currentStr9 = str1.slice(1, 4);  //avs

//마이너스는 뒷자리부터 시작
const currentStr10 = str1.slice(-1);  //e
const currentStr11 = str1.slice(-2);  //ce
const currentStr12 = str1.slice(-3);  //nce
const currentStr13 = str1.slice(-3, -1);  //nc
const currentStr14 = str1.slice(-3, -2);  //n
const currentStr15 = str1.slice(-3, -3);  //

const currentStr16 = str1.slice(1, 4);  //ava
const currentStr17 = str1.slice(4, 1);  //ava

//서브 스트링은 자동으로 인식해서 출력시켜준다
const currentStr18 = str1.substring(1, 4);  //ava
const currentStr19 = str1.substring(4, 1);  //ava

const currentStr20 = str1.substr(0);  // javascript reference
const currentStr21 = str1.substr(1);  // avascript reference
const currentStr22 = str1.substr(2);  // vascript reference
const currentStr23 = str1.substr(0, 1);  // j
const currentStr24 = str1.substr(0, 2);  // ja
const currentStr25 = str1.substr(0, 3);  // jav
const currentStr26 = str1.substr(1, 2);  // av
const currentStr27 = str1.substr(1, 3);  // ava
const currentStr28 = str1.substr(1, 4);  // avas
const currentStr29 = str1.substr(-1);  // e
const currentStr30 = str1.substr(-2);  // ce
const currentStr31 = str1.substr(-3);  // nce
const currentStr32 = str1.substr(-1, 1);  // e
const currentStr33 = str1.substr(-2, 2);  // ce
const currentStr34 = str1.substr(-3, 3);  // nce

05. split() : ★★

1. "문자열".slice(시작위치)
2. "문자열".slice(시작위치, 끝나는 위치)
3. 시작 위치는 문자열을 뽑아내야 하기 떄문에 시작위치는 끝나는 위치보다 숫자가 작아야 한다
4. substring() 시작값이 끝나는 값보다 클 경우 두 값을 바꿔서 처리(에러 방지)
5. "문자열".substr(시작위치)
6. "문자열".substr(시작위치, 길이) ㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁ
// "문자열".split(구분자(separator));
// "문자열".split(정규식 표현);
// "문자열".split(구분자, 갯수);

const str1 = "javascript reference";
const currentStr1 = str1.split('');         // 한글자씩 쪼개서 배열로 반환해줍니다. ['j', 'a', 'v', 'a', 's', 'c', 'r', 'i', 'p', 't', ' ', 'r', 'e', 'f', 'e', 'r', 'e', 'n', 'c', 'e']
const currentStr2 = str1.split(' ');        // 포함되어 있는 단어를 배열로 반환해줍니다. ['j', 'a', 'v', 'a', 's', 'c', 'r', 'i', 'p', 't', ' ', 'r', 'e', 'f', 'e', 'r', 'e', 'n', 'c', 'e']
const currentStr3 = str1.split('', 1);      // ['j']
const currentStr4 = str1.split('', 2);      // ['ja']
const currentStr5 = str1.split(' ', 1);     // ['javascript']
const currentStr6 = str1.split(' ', 2);     // ['javascript', 'reference']
const currentStr7 = str1.split('j');        // j를 기준으로 배열을 나눔['', 'avascript reference']
const currentStr8 = str1.split('a');        // a를 기준으로 배열을 나눔['j', 'v', 'script reference']
const currentStr9 = str1.split('e');        // e를 기준으로 배열을 나눔['javascript r', 'f', 'r', 'nc', '']

const str2 = "java/script/refer/ence";
const currentStr10 = str2.split('/');       // ['java', 'script', 'refer', 'ence']

const str3 = "java&script&refer!ence";
const currentStr11 = str3.split('!');       // 느낌표를 찾아서 구분 ['java&script&refer', 'ence']
const currentStr12 = str3.split('&');       // ['java', 'script', 'refer!ence']
const currentStr13 = str3.split(/&|\!/);    // ['java', 'script', 'refer', 'ence']

const str4 = "java&script&refer!ence";
const currentStr14 = str4.split('').join();                 // 정방향 출력 j,a,v,a,&,s,c,r,i,p,t,&,r,e,f,e,r,!,e,n,c,e
const currentStr15 = str4.split('').join('*');              // * 추가 j*a*v*a*&*s*c*r*i*p*t*&*r*e*f*e*r*!*e*n*c*e
const currentStr16 = str4.split('').reverse().join();       // 반대로 출력 e,c,n,e,!,r,e,f,e,r,&,t,p,i,r,c,s,&,a,v,a,j
const currentStr17 = str4.split('').reverse().join('/');    // 반대로 출력하면서 / 추가e/c/n/e/!/r/e/f/e/r/&/t/p/i/r/c/s/&/a/v/a/j

06. replace() / replaceAll() : ★★

replace() 메서드는 문자열을 부분 문자로 구분하고 배열로 반환합니다.
// mdn의 설명을 넣고 풀네임 string.prototype.replace와 같은

// "문자열".replace("찾을 문자열", "변경할 문자열")
// "문자열".replace(정규식)
// "문자열".replace(정규식, 변경할 문자열)
const str1 = "javascript reference"
const currentStr1 = str1.replace("javascript", "자바스크립트");     //자바스크립트 reference
const currentStr2 = str1.replace("j", "J");                     //Javascript reference
const currentStr3 = str1.replace("e", "E");                     //javascript rEference
const currentStr4 = str1.replaceAll("e", "E");                  //avascript rEfErEncE 한가지만 바꾸는것이 아닌 다중으로 선택해 변경할때는 All 사용
const currentStr5 = str1.replace(/e/g, "E");                  //javascript rEfErEncE 소문자 대문자를 구별해서 찾아서 변경
const currentStr6 = str1.replace(/e/i, "E");                  //javascript rEference 소문자 대문자 구별하지 않고 다 찾아서 변경

const str2 = "https://www.naver.comn/img01.jpg"
const currentStr7 = str2.replace("1", "2");                   //1을 2로 바꿈

const str3 = "010-2000-1000";

const currentStr8 =  str3.replace("-", ""); //0100000-1000
const currentStr9 =  str3.replaceAll("-", ""); //01000001000
const currentStr10 =  str3.replaceAll(/-/g, ""); //01000001000
const currentStr11 =  str3.replaceAll(/-/g, " "); //010 0000 1000
const currentStr12 =  str3.replaceAll("-", "*"); //0100000-1000
const currentStr13 =  str3.replaceAll(/[1-9]/g, "*"); //0*0-*000-*000 1부터 9까지의 번호를 없앰

    // 정규식 표현은 / / 이렇게 사용

07. concat()

concat() 메서드는 둘 이상의 문자열을 결합하여, 새로운 문자열을 반환합니다.
//"문자열".concat(문자열)
//"문자열".concat(문자열, 문자열,,,,)

const str1 = "javascript";
const currentStr1 = str1.concat("reference"); // javascriptreference concat은 두개의 문자열을 결합시켜줌
const currentStr2 = str1.concat(" ", "reference"); // javascript reference 첫번째 사이는 무슨 문자를 결합시켜줄지, 두번째 이상은 어떤 문자랑 결합할지
const currentStr3 = str1.concat(",", "reference"); // javascript,reference 첫번째 사이는 무슨 문자를 결합시켜줄지, 두번째 이상은 어떤 문자랑 결합할지
const currentStr4 = str1.concat(",", "reference" , "," , "book"); // javascript,referecne,book 첫번째 사이는 무슨 문자를 결합시켜줄지, 두번째 이상은 어떤 문자랑 결합할지
const currentStr5 = str1.concat(",", ["referecne", "book"]); // javascript,referecne,book 첫번째 사이는 무슨 문자를 결합시켜줄지, 두번째 이상은 어떤 문자랑 결합할지

console.log(currentStr13)

08. repeat()

repeat() 메서드는 문자열을 복사하여, 복사한 새로운 문자열을 반환합니다.
// mdn의 설명을 넣고 풀네임 string.prototype.replace와 같은

// "문자열".replace("찾을 문자열", "변경할 문자열")
// "문자열".replace(정규식)
// "문자열".replace(정규식, 변경할 문자열)
const str1 = "javascript reference"
const currentStr1 = str1.replace("javascript", "자바스크립트");     //자바스크립트 reference
const currentStr2 = str1.replace("j", "J");                     //Javascript reference
const currentStr3 = str1.replace("e", "E");                     //javascript rEference
const currentStr4 = str1.replaceAll("e", "E");                  //avascript rEfErEncE 한가지만 바꾸는것이 아닌 다중으로 선택해 변경할때는 All 사용
const currentStr5 = str1.replace(/e/g, "E");                  //javascript rEfErEncE 소문자 대문자를 구별해서 찾아서 변경
const currentStr6 = str1.replace(/e/i, "E");                  //javascript rEference 소문자 대문자 구별하지 않고 다 찾아서 변경

const str2 = "https://www.naver.comn/img01.jpg"
const currentStr7 = str2.replace("1", "2");                   //1을 2로 바꿈

const str3 = "010-2000-1000";

const currentStr8 =  str3.replace("-", ""); //0100000-1000
const currentStr9 =  str3.replaceAll("-", ""); //01000001000
const currentStr10 =  str3.replaceAll(/-/g, ""); //01000001000
const currentStr11 =  str3.replaceAll(/-/g, " "); //010 0000 1000
const currentStr12 =  str3.replaceAll("-", "*"); //0100000-1000
const currentStr13 =  str3.replaceAll(/[1-9]/g, "*"); //0*0-*000-*000 1부터 9까지의 번호를 없앰

// 정규식 표현은 / / 이렇게 사용

console.log(currentStr13)

09. padStart() / padEnd()

padStart/padEnd() 메서드는 주어진 길이에 맞게 앞(start)/뒤(end) 문자열을 채우고, 새로운 문자열을 반환합니다.
//"문자열".padStart(길이)
//"문자열".padStart(길이, 문자열)
const str1 = "456";
const currentStr1 = str1.padStart(1, "0");      //456
const currentStr2 = str1.padStart(2, "0");      //456
const currentStr3 = str1.padStart(3, "0");      //456
const currentStr4 = str1.padStart(4, "0");      //0456
const currentStr5 = str1.padStart(5, "0");      //00456
const currentStr6 = str1.padStart(6, "0");      //000456 자리값에 따라 원하는 문자를 그 자리수 만큼 넣을 수 있다.
const currentStr7 = str1.padStart(6, "1");      //111456 자리값에 따라 원하는 문자를 그 자리수 만큼 넣을 수 있다.
const currentStr8 = str1.padStart(6, "12");      //121456 자리값에 따라 원하는 문자를 그 자리수 만큼 넣을 수 있다.
const currentStr9 = str1.padStart(6, "123");      //123456 자리값에 따라 원하는 문자를 그 자리수 만큼 넣을 수 있다.
const currentStr10 = str1.padStart(6, "1234");      //123456 기존 자리값은 3자리였으니 123만 들어가게된다
const currentStr11 = str1.padStart(6);      //   456 아무것도 안쓰면 공백이 3자리 만큼 차지하게 됨

const currentStr12 = str1.padEnd(1, "0");      //456 
const currentStr13 = str1.padEnd(2, "0");      //456 
const currentStr14 = str1.padEnd(3, "0");      //456 
const currentStr15 = str1.padEnd(4, "0");      //4560 자릿수 중 1칸만 0을 붙입니다.
const currentStr16 = str1.padEnd(5, "0");      //45600 자릿수 중 2칸만 0을 붙입니다.
const currentStr17 = str1.padEnd(6, "0");      //456000 자릿수 중 3칸만 0을 붙입니다.
const currentStr18 = str1.padEnd(6, "1");      //456111 자릿수 중 3칸만 1을 붙입니다.
const currentStr19 = str1.padEnd(6, "12");      //456121 자릿수 중 3칸만 12을 붙입니다.
const currentStr20 = str1.padEnd(6, "123");      //456123 자릿수 중 3칸만 123을 붙입니다.
const currentStr21 = str1.padEnd(6, "1234");      //456123 자릿수 중 3칸만 123(4는 자릿수가 부족해 못씀)을 붙입니다.
const currentStr22 = str1.padEnd(6);      //456(공백 3개) 뒷자리에 공백 3개를 붙여 출력합니다.

10. indexOf()

문자열에서 특정 문자의 위치를 찾고 숫자를 반환합니다.

"문자열".indexOf(검색값)
"문자열".indexOf(검색값, 위치값)
 // "문자열".indexOf(검색값)
// "문자열".indexOf(검색값, 위치값)
// "문자열".lastIndexOf(검색값)
// "문자열".lastIndexOf(검색값, 위치값)

const str1 = "javascript reference";
const currentStr1 = str1.indexOf("javascript"); //indexOf는 찾는값의 첫번째 자리 시작값 0 : 답 0
const currentStr2 = str1.indexOf("reference"); // 답 11
const currentStr3 = str1.indexOf("j"); // 답 0
const currentStr4 = str1.indexOf("a"); // 답 1
const currentStr5 = str1.indexOf("v"); // 답 2

const currentStr6 = str1.indexOf("jquery"); //indexOf는 데이터가 없을때 : 답 -1
const currentStr7 = str1.indexOf("b"); //indexOf는 데이터가 없을때 : 답 -1
const currentStr8 = str1.indexOf("javascript, 0"); // 0번째 자리에 있는지 : 답 0
const currentStr9 = str1.indexOf("javascript, 1"); // 1번째 자리에 있는지 : 답 -1
const currentStr10 = str1.indexOf("reference, 0"); // 0번째 자리에 있는지 : 답 11
const currentStr11 = str1.indexOf("reference, 1"); // 1번째 자리에 있는지 : 답 11
const currentStr12 = str1.indexOf("reference, 11"); // 11번째 자리에 있는지 : 답 11
const currentStr13 = str1.indexOf("reference, 12"); // 12번째 자리에 있는지 : 답 -1 사유 : 12번째부터는 없으니까

const currentStr14 = str1.lastIndexOf("javascript");                // 0번째부터 값이 있고 있으니까 맨앞의 0이 나옵니다.
const currentStr15 = str1.lastIndexOf("reference");                 // 11이 나옵니다
const currentStr16 = str1.lastIndexOf("j");                         // 맨 앞에 j가 있으니 0이 나옵니다.
const currentStr17 = str1.lastIndexOf("a");                         // 맨 앞에 a가 있으니 j(1), a(중복), v(2), a(3) 그래서 3이 나옵니다.
const currentStr18 = str1.lastIndexOf("v");                         // 맨 앞에 v가 있으니 2이 나옵니다.
const currentStr19 = str1.lastIndexOf("jquery");                    // 맨 앞에 v가 있으니 -1이 나옵니다.
const currentStr20 = str1.lastIndexOf("b");                         // 맨 앞에 b가 있으니 -1이 나옵니다.
const currentStr21 = str1.lastIndexOf("javascript", 0);             // 0
const currentStr22 = str1.lastIndexOf("javascript", 1);             // 0
const currentStr23 = str1.lastIndexOf("reference", 0);              // -1
const currentStr24 = str1.lastIndexOf("reference", 1);              // -1
const currentStr25 = str1.lastIndexOf("reference", 11);             // 11
const currentStr26 = str1.lastIndexOf("reference", 12);             // 11

11. includes()

includes() 메서드는 문자열 포함 여부를 검색하여, 불린(true, false)을 반환합니다.

"문자열".includes(검색값)
"문자열".includes(검색값, 시작값) - indexOf와 유사
 // "문자열".indexOf(검색값)
// "문자열".indexOf(검색값, 위치값)
// "문자열".lastIndexOf(검색값)
// "문자열".lastIndexOf(검색값, 위치값)

const str1 = "javascript reference";
const currentStr1 = str1.indexOf("javascript"); //indexOf는 찾는값의 첫번째 자리 시작값 0 : 답 0
const currentStr2 = str1.indexOf("reference"); // 답 11
const currentStr3 = str1.indexOf("j"); // 답 0
const currentStr4 = str1.indexOf("a"); // 답 1
const currentStr5 = str1.indexOf("v"); // 답 2

const currentStr6 = str1.indexOf("jquery"); //indexOf는 데이터가 없을때 : 답 -1
const currentStr7 = str1.indexOf("b"); //indexOf는 데이터가 없을때 : 답 -1
const currentStr8 = str1.indexOf("javascript, 0"); // 0번째 자리에 있는지 : 답 0
const currentStr9 = str1.indexOf("javascript, 1"); // 1번째 자리에 있는지 : 답 -1
const currentStr10 = str1.indexOf("reference, 0"); // 0번째 자리에 있는지 : 답 11
const currentStr11 = str1.indexOf("reference, 1"); // 1번째 자리에 있는지 : 답 11
const currentStr12 = str1.indexOf("reference, 11"); // 11번째 자리에 있는지 : 답 11
const currentStr13 = str1.indexOf("reference, 12"); // 12번째 자리에 있는지 : 답 -1 사유 : 12번째부터는 없으니까

const currentStr14 = str1.lastIndexOf("javascript");                // 0번째부터 값이 있고 있으니까 맨앞의 0이 나옵니다.
const currentStr15 = str1.lastIndexOf("reference");                 // 11이 나옵니다
const currentStr16 = str1.lastIndexOf("j");                         // 맨 앞에 j가 있으니 0이 나옵니다.
const currentStr17 = str1.lastIndexOf("a");                         // 맨 앞에 a가 있으니 j(1), a(중복), v(2), a(3) 그래서 3이 나옵니다.
const currentStr18 = str1.lastIndexOf("v");                         // 맨 앞에 v가 있으니 2이 나옵니다.
const currentStr19 = str1.lastIndexOf("jquery");                    // 맨 앞에 v가 있으니 -1이 나옵니다.
const currentStr20 = str1.lastIndexOf("b");                         // 맨 앞에 b가 있으니 -1이 나옵니다.
const currentStr21 = str1.lastIndexOf("javascript", 0);             // 0
const currentStr22 = str1.lastIndexOf("javascript", 1);             // 0
const currentStr23 = str1.lastIndexOf("reference", 0);              // -1
const currentStr24 = str1.lastIndexOf("reference", 1);              // -1
const currentStr25 = str1.lastIndexOf("reference", 11);             // 11
const currentStr26 = str1.lastIndexOf("reference", 12);             // 11

12. search()

search() 메서드는 문자열을 검색하고 위치값(숫자)를 반환합니다.

"문자열".search("검색값"); "문자열".search(정규식 표현);
 // "문자열".indexOf(검색값)
// "문자열".indexOf(검색값, 위치값)
// "문자열".lastIndexOf(검색값)
// "문자열".lastIndexOf(검색값, 위치값)

const str1 = "javascript reference";
const currentStr1 = str1.indexOf("javascript"); //indexOf는 찾는값의 첫번째 자리 시작값 0 : 답 0
const currentStr2 = str1.indexOf("reference"); // 답 11
const currentStr3 = str1.indexOf("j"); // 답 0
const currentStr4 = str1.indexOf("a"); // 답 1
const currentStr5 = str1.indexOf("v"); // 답 2

const currentStr6 = str1.indexOf("jquery"); //indexOf는 데이터가 없을때 : 답 -1
const currentStr7 = str1.indexOf("b"); //indexOf는 데이터가 없을때 : 답 -1
const currentStr8 = str1.indexOf("javascript, 0"); // 0번째 자리에 있는지 : 답 0
const currentStr9 = str1.indexOf("javascript, 1"); // 1번째 자리에 있는지 : 답 -1
const currentStr10 = str1.indexOf("reference, 0"); // 0번째 자리에 있는지 : 답 11
const currentStr11 = str1.indexOf("reference, 1"); // 1번째 자리에 있는지 : 답 11
const currentStr12 = str1.indexOf("reference, 11"); // 12번째 자리에 있는지 : 답 11
const currentStr13 = str1.indexOf("reference, 12"); // 12번째 자리에 있는지 : 답 -1 사유 : 12번째부터는 없으니까

const currentStr14 = str1.lastIndexOf("javascript");                // 0번째부터 값이 있고 있으니까 맨앞의 0이 나옵니다.
const currentStr15 = str1.lastIndexOf("reference");                 // 11이 나옵니다
const currentStr16 = str1.lastIndexOf("j");                         // 맨 앞에 j가 있으니 0이 나옵니다.
const currentStr17 = str1.lastIndexOf("a");                         // 맨 앞에 a가 있으니 j(1), a(중복), v(2), a(3) 그래서 3이 나옵니다.
const currentStr18 = str1.lastIndexOf("v");                         // 맨 앞에 v가 있으니 2이 나옵니다.
const currentStr19 = str1.lastIndexOf("jquery");                    // 맨 앞에 v가 있으니 -1이 나옵니다.
const currentStr20 = str1.lastIndexOf("b");                         // 맨 앞에 b가 있으니 -1이 나옵니다.
const currentStr21 = str1.lastIndexOf("javascript", 0);             // 0
const currentStr22 = str1.lastIndexOf("javascript", 1);             // 0
const currentStr23 = str1.lastIndexOf("reference", 0);              // -1
const currentStr24 = str1.lastIndexOf("reference", 1);              // -1
const currentStr25 = str1.lastIndexOf("reference", 11);             // 11
const currentStr26 = str1.lastIndexOf("reference", 12);             // 11

13. match()

search() 메서드는 문자열을 검색하고 위치값(숫자)를 반환합니다.

::설명
match는 결과 값이 배열로 표현이 된다 위치는 어딘지 어떤 텍스트를 찾았는지 등등
const str1 = "javascript reference"

const currentStr1 = str1.match("javascript");                // ['javascript', index: 0, input: 'javascript reference', groups: undefined]
const currentStr2 = str1.match("reference");                //['reference', index: 11, input: 'javascript reference', groups: undefined]
const currentStr3 = str1.match("r");                // ['r', index: 6, input: 'javascript reference', groups: undefined]
const currentStr4 = str1.match(/reference/);                // ['reference', index: 11, input: 'javascript reference', groups: undefined]
const currentStr5 = str1.match(/Reference/);                // ['reference', index: 11, input: 'javascript reference', groups: undefined]
const currentStr6 = str1.match(/Reference/i);                // ['reference', index: 11, input: 'javascript reference', groups: undefined]
const currentStr7 = str1.match(/r/g);                // ['r', 'r', 'r']
const currentStr8 = str1.match(/e/g);                // ['e', 'e', 'e', 'e']

14. charAt()

charAt() 메서드는 지정한 숫자의 단일 문자 값을 반환하며 charCodeAt() 메서드는 지정한 숫자의 유니코드 값을 반환합니다.

::설명
//"문자열".charAt(숫자); //"문자열".charCodeAt(숫자);
const str1 = "javascript reference"
const currentStr1 = str1.charAt();          //j (4) ['e', 'e', 'e', 'e']
const currentStr2 = str1.charAt("0");       //j (4) ['e', 'e', 'e', 'e']
const currentStr3 = str1.charAt("1");       //a (4) ['e', 'e', 'e', 'e']
const currentStr4 = str1.charAt("2");       //v (4) ['e', 'e', 'e', 'e']

const currentStr5 = str1.charCodeAt();      //106
const currentStr6 = str1.charCodeAt("0");   //106
const currentStr7 = str1.charCodeAt("1");   //97
const currentStr8 = str1.charCodeAt("2");   //118

15. startsWidth() / endsWidth()

startsWidth() 메서드는 시작하는 문자열에서 문자열을 검색하여 불린(true, false)으로 반환합니다. endsWidth() 메서드는 끝나는 문자열에서 문자열을 검색하여 불린(true, false)으로 반환합니다.

::설명
1-1. "문자열".startsWidth(검색 문자열); 1-2. "문자열".startsWidth(검색 문자열, 위치값); 2-1. "문자열".endsWidth(검색 문자열); 2-2. "문자열".endsWidth(검색 문자열, 위치값);
const str1 = "javascript reference";

const currentStr1 = str1.startsWith('javascript');      //true
const currentStr2 = str1.startsWith('j');               //true
const currentStr3 = str1.startsWith('java');            //true
const currentStr4 = str1.startsWith('reference');       //false
const currentStr5 = str1.startsWith();                  //false
const currentStr6 = str1.startsWith('');                //true
const currentStr7 = str1.startsWith('reference', 7);    //false
const currentStr8 = str1.startsWith('reference', 11);   //true


const currentStr9 = str1.endsWith('reference');         //true
const currentStr10 = str1.endsWith('e');                //true
const currentStr11 = str1.endsWith('refer');            //false
const currentStr12 = str1.endsWith('javascript');       //false
const currentStr13 = str1.endsWith();                   //false
const currentStr14 = str1.endsWith('');                 //true
const currentStr15 = str1.endsWith('reference', 7);     //false
const currentStr16 = str1.endsWith('reference', 20);    //true