Javascript

{
    // 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 = "숫자(string) 결합";
    document.querySelector(".sample01_P2").innerHTML = num1 + num2;
    //자바스크립트제이쿼리
    // 03
    const tect1 = "모던";
    const tect2 = "자바스크립트";
    const tect3 = "핵심";
    document.querySelector(".sample01_N3").innerHTML = "3";
    document.querySelector(".sample01_Q3").innerHTML = "모던,자바스크립트,핵심";
    document.querySelector(".sample01_M3").innerHTML = "문자열(string) 결합";
    document.querySelector(".sample01_P3").innerHTML = "나는 " + tect1 +"(modern) "+ tect2 +"(javascript) " + tect3 + "을 배우고 싶다.";
    document.querySelector(".sample01_N4").innerHTML = "3";
    document.querySelector(".sample01_Q4").innerHTML = "모던,자바스크립트,핵심";
    document.querySelector(".sample01_M4").innerHTML = "템플릿 문자열";
    document.querySelector(".sample01_P4").innerHTML = `나는 ${tect1} (modern) ${tect2}(javascript) ${tect3}을 배우고 싶다.`;
    // ${}새로나옴
    // 나는 모던(modern) 자바스크립트(javascript) 핵심을 배우고 싶다.
    }
    

const str1 = "javascript";
    const currentStr1 = str1.toLocaleUpperCase();

    document.querySelector(".sample02_N1").innerHTML = "1";
    document.querySelector(".sample02_Q1").innerHTML = "javascript";
    document.querySelector(".sample02_M1").innerHTML = "문자열(string) 결합";
    document.querySelector(".sample02_P1").innerHTML = currentStr1;

    const str2 = "Javascript"
    const currentStr2 = str1.toLowerCase();

    document.querySelector(".sample02_N2").innerHTML = "2";
    document.querySelector(".sample02_Q2").innerHTML = "Javascript";
    document.querySelector(".sample02_M2").innerHTML = "문자열(string) 결합";
    document.querySelector(".sample02_P2").innerHTML = currentStr2;
    

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;
    

const str1 = "javascript relerence"
    const currentStr1 = str1.slice(0); //javascript relerence
    const currentStr2 = str1.slice(1); //avascript reference
    const currentStr3 = str1.slice(2); //vescript relerence
    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); //ava
    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); //'' 에러방지?
    const currentStr18 = str1.substring(1, 4); //ava
    const currentStr19 = str1.substring(4, 1); //ava  substring 알아서 (숫자) 바꿔준다.

    const currentStr20 = str1.substr(0); //javascript relerence
    const currentStr21 = str1.substr(1); //avastript relerence
    const currentStr22 = str1.substr(2); //vascript relerence
    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
    

const str1 = "javascript reference" //split 알고리즘 많이 사용 중복된것을 삭제하거나 바꿀 수 잇다. 합칠수도 있음.
    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(' ')  // ['javascript', 'reference']
    const currentStr3 = str1.split('', 1)  // ['j']
    const currentStr4 = str1.split('', 2)  // ['j', 'a']
    const currentStr5 = str1.split(' ', 1)  // ['javascript']
    const currentStr6 = str1.split(' ', 2)  // ['javascript', 'reference']
    const currentStr7 = str1.split('j')  // ['javascript', 'reference']
    const currentStr8 = str1.split('a')  // ['j', 'v', 'script reference']
    const currentStr9 = str1.split('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'] //split & 를 다 찾지 못해서
    const currentStr13 = str3.split(/&|\!/); //['java', 'script', 'refer', 'ence'] ///&|\!/ 에 &을 넣어준다.


    const str4 = "javascript reference";
    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('').reverse('*'); //['e', 'c', 'n', 'e', 'r', 'e', 'f', 'e', 'r', ' ', 't', 'p', 'i', 'r', 'c', 's', 'a', 'v', 'a', 'j'] //reverse 을 사용하여 반대로 출력
    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
    

const str1 = "javascript reference";
    const cirrentStr1 = str1.replace("javascript", "자바스크립트"); //자바스크립트 reference
    const cirrentStr2 = str1.replace("j", "J");                     //Javascript reference
    const cirrentStr3 = str1.replace("e", "E");                     //javascript rEference 첫번째e만 바뀜
    const cirrentStr4 = str1.replaceAll("e", "E");                  //javascript rEfErEncE e가 다 바뀐다.
    const cirrentStr5 = str1.replace(/e/g, "E");                    //javascript rEfErEncE e가 다 바뀐다.(g)여러개를 선택하다.
    const cirrentStr6 = str1.replace(/e/gi, "E");                   //javascript rEfErEncE e가 다 바뀐다.

    const str2 = "https://www.naver.com/img01.jpg";
    const cirrentStr7 = str2.replace("img01","img02");  //https://www.naver.com/img02.jpg

    const str3 = "010-2000-1000";
    // 01020001000
    const cirrentStr8 = str3.replace("-", "");              //0102000-1000
    const cirrentStr9 = str3.replaceAll("-", "");           //01020001000
    const cirrentStr10 = str3.replaceAll(/-/g, "");         //01020001000
    const cirrentStr11 = str3.replaceAll(/-/g, " ");        //010 2000 1000
    const cirrentStr12 = str3.replaceAll("-", "*");         //010*2000*1000
    const cirrentStr13 = str3.replaceAll(/[1-9]/g, "*");    //0*0-*000-*000
    

const str1 = "javascript";
    const currentStr1 = str1.concat("reference");                       //javascriptreference
    const currentStr2 = str1.concat(" ", "reference");                  //javascript reference
    const currentStr3 = str1.concat(", ", "reference");                 //javascript, reference
    const currentStr4 = str1.concat(", ", "reference", ", ", "book");   //javascript, reference, book
    const currentStr5 = str1.concat(",", ["reference","book"]);         //javascript,reference,book
    

const str1 = "javascript";
    const currentStr1 = str1.repeat(0); //'' 안나옴
    const currentStr2 = str1.repeat(1); //javascript
    const currentStr3 = str1.repeat(2); //javascriptjavascript
    

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
    const currentStr11 = str1.padStart(6); //   456 앞에 공백처리 됌.

    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
    const currentStr16 = str1.padEnd(5, "0"); //45600
    const currentStr17 = str1.padEnd(6, "0"); //456000
    const currentStr18 = str1.padEnd(6, "1"); //456111
    const currentStr19 = str1.padEnd(6, "12"); //456121
    const currentStr20 = str1.padEnd(6, "123"); //456123
    const currentStr21 = str1.padEnd(6, "1231"); //456123
    const currentStr22 = str1.padEnd(6); //456   뒤에 공백처리 됌.
    

//0 1 2 3 4 5 6 7 8 9 10 11
    const str1 = "javascript reference"
    const currentStr1 = str1.indexOf("javascript"); //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"); //-1 데이ㅓ가 없으면-1로 나온다.
    const currentStr7 = str1.indexOf("b"); //-1 
    const currentStr8 = str1.indexOf("javascript", 0); //0 
    const currentStr9 = str1.indexOf("javascript", 1); //-1
    const currentStr10 = str1.indexOf("reference", 0); //11
    const currentStr11 = str1.indexOf("reference", 1); //11
    const currentStr12 = str1.indexOf("reference", 11); //11
    const currentStr13 = str1.indexOf("reference", 12); //-1    

    //11 10 9 8 7 6 5 4 3 2 1 0
    const str2 = "javascript reference"

    const currentStr14 = str1.lastIndexOf("javascript");    //0 
    const currentStr15 = str1.lastIndexOf("reference");     //11
    const currentStr16 = str1.lastIndexOf("j");             //0
    const currentStr17 = str1.lastIndexOf("a");             //3 순서가 뒤에서 기준?
    const currentStr18 = str1.lastIndexOf("v");             //2 
    const currentStr19 = str1.lastIndexOf("jquery");        //-1
    const currentStr20 = str1.lastIndexOf("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
    

const str1 = "javascript reference"
    const currentStr1 = str1.includes("javascript");        //true  포함여부를 알려줌.
    const currentStr2 = str1.includes("j");                 //true
    const currentStr3 = str1.includes("b");                 //false
    const currentStr4 = str1.includes("reference");         //true
    const currentStr5 = str1.includes("reference", 1);      //true
    const currentStr6 = str1.includes("reference", 11);     //true
    const currentStr7 = str1.includes("reference", 12);     //false
    

const str1 = "javascript reference";
    const currentStr1 = str1.search("javascript");      //0
    const currentStr2 = str1.search("reference");       //11
    const currentStr3 = str1.search("j");               //0
    const currentStr4 = str1.search("a");               //1
    const currentStr5 = str1.search("v");               //2
    const currentStr6 = str1.search("jquery");          //-1
    const currentStr7 = str1.search("b");               //-1
    const currentStr8 = str1.search(/[a-z]/g);          //0
    

const str1 = "javascript reference";
    const currentStr1 = str1.match("javascript");        //javascript
    const currentStr2 = str1.match("reference");         //reference
    const currentStr3 = str1.match("r");                 //r
    const currentStr4 = str1.match(/reference/);         //reference
    const currentStr5 = str1.match(/Reference/);         //null
    const currentStr6 = str1.match(/Reference/i);        //reference
    const currentStr7 = str1.match(/r/g);                //'r', 'r', 'r' 알고리즘 때 많이 사용
    const currentStr8 = str1.match(/e/g);                //'e', 'e', 'e', 'e' 
    

const str1 = "javascript reference";
const currentStr1 = str1.charAt();        //j
const currentStr2 = str1.charAt("0");     //j
const currentStr3 = str1.charAt("1");     //a
const currentStr4 = str1.charAt("2");     //v

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

{
    const str1 = "javascript reference";
    const currentSte1 = str1.startsWith('javascript');  //true
    const currentSte2 = str1.startsWith('j');  //true
    const currentSte3 = str1.startsWith('java');  //true
    const currentSte4 = str1.startsWith('reference');  //fasle
    const currentSte5 = str1.startsWith();  //true
    const currentSte6 = str1.startsWith('');  //true
    const currentSte7 = str1.startsWith('reference', 7);  //false
    const currentSte8 = str1.startsWith('reference', 11);  //true

    const currentSte9 = str1.endsWith('reference');  //true
    const currentSte10 = str1.endsWith('e');  //true
    const currentSte11 = str1.endsWith('refer');  //fasle
    const currentSte12 = str1.endsWith('javascript');  //fasle
    const currentSte13 = str1.endsWith();  //fasle
    const currentSte14 = str1.endsWith('');  //true
    const currentSte15 = str1.endsWith('reference', 7);  //false
    const currentSte16 = str1.endsWith('reference', 20);  //true
}