Javascript

// 01 번 sample
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번 sample
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번 sample
const text1 = "모던";
const text2 = "자바스크립트";
const text3 = "핵심";

// 결과출력 --> 나는 모던(modern) 자바스크립트(javascript) 핵심을 배우고 싶다.
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 +"을 배우고 싶다.";

// 04번 sample
document.querySelector(".sample01_N4").innerHTML = "4";
document.querySelector(".sample01_Q4").innerHTML = "모던, 자바스크립트, 핵심";
document.querySelector(".sample01_M4").innerHTML = "템플릿 문자열";
document.querySelector(".sample01_P4").innerHTML = `나는 ${text1}(modern) ${text2}(javascript) ${text3}을 배우고 싶다.`;

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 = str2.toLowerCase(); 

document.querySelector(".sample02_N2").innerHTML = "2";
document.querySelector(".sample02_Q2").innerHTML = "JAVASCRIPT";
document.querySelector(".sample02_M2").innerHTML = "toLowerCase()";
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 reference';
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, 1);  //안나옴
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);   //안나옴
const currentStr18 = str1.substring(4,1);   //ava
const currentStr19 = str1.substring(1,4);   //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,3);   //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);   //ce

const str1 = "javascript reference";
const currentStr1 = str1.split(''); //['j', 'a', 'v', 'a', 's', ...배열로 출력]
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');    //['', 'avascript 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']
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('').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

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");   //javascript rEfErEncE : 중복된것도 다 바뀜
const currentStr5 = str1.replace(/e/g,"E");   //javascript rEfErEncE : All이 나오기 이전까진 이렇게 정규식 사용함.g는 여러개(=all)
const currentStr6 = str1.replace(/e/gi,"E");   //javascript rEfErEncE : i는 소대문자 구분없이 찾아줌.

const str2 = "https://www.naver.com/img01.jpg";
// const currentStr7 = str2.replace(1, 2); //이렇게 해도되지만 이러면 오류날 가능성 多
const currentStr7 = str2.replace("img01.jpg", "img02.jpg"); 

const str3 = "010-2000-1000";
const currentStr8 = str3.replace("-","");       //0102000-1000
const currentStr9 = str3.replaceAll("-","");    //01020001000
const currentStr10 = str3.replace(/-/g,"");     //01020001000
const currentStr11 = str3.replace(/-/g," ");    //010 2000 1000
const currentStr12 = str3.replace(/-/g,"*");    //010*2000*1000
const currentStr13 = str3.replace(/[1-9]/g,"*");    //0*0-*000-*000 : [0-9]:0부터9까지의 숫자 검색

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, "1234");       //456123
const currentStr22 = str1.padEnd(6);       //456   

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

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    //없는 데이터는 -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.charAt(); // 106
const currentStr6 = str1.charAt("0"); // 106
const currentStr7 = str1.charCodeAt("1"); // 97
const currentStr8 = str1.charCodeAt("2"); // 118

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