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 = "숫자(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 + "을 배우고 싶다.";

//04
document.querySelector(".sample01_N4").innerHTML = "4";
document.querySelector(".sample01_Q4").innerHTML = "모던, 자바스크립트, 핵심";
document.querySelector(".sample01_M4").innerHTML = "템플릿 문자열";
document.querySelector(".sample01_P4").innerHTML = `나는 ${text1}(modern) ${text2}(javascipt) ${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_N1").innerHTML = "2";
document.querySelector(".sample02_Q1").innerHTML = "JAVASCRIPT";
document.querySelector(".sample02_M1").innerHTML = "toLowerCase()";
document.querySelector(".sample02_P1").innerHTML = currentStr2;

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

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

console.log(str1);

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

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

console.log(str2);

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

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

console.log(str3);

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,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); //''
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

console.log(currentStr34);

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(' '); // ['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 = "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


console.log(currentStr17); 

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 모든e를 찾아서 E로 변경함 
const currentStr5 = str1.replaceAll(/e/g, "E"); //javascript rEfErEncE 모든e를 찾아서 E로 변경함 - 정규식 표현 
const currentStr6 = str1.replaceAll(/e/gi, "E"); //javascript rEfErEncE 모든e/E를 찾아서 E로 변경함 - 정규식 표현 

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

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
console.log(currentStr13);

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 - 배열로도 쓸 수 있음 

console.log(currentStr5);

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

console.log(currentStr3);

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 4가 짤림 
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
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___ 뒤 3자리는 공백처리

console.log(currentStr22);

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출력
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 jav'a'script
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] i=대/소문자 상관X 검색
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