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 + "을 배우고 싶다.";
            
// console.log("나는" + text1 + text2 + 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}(javascript) ${text3}을 배우고싶다.`;

const str1 = "javascript";
const currentStr1 = str1.toUpperCase();
const str2 = "JAVASCRIPT";
const currentStr2 = str2.toLowerCase();

document.querySelector(".sample02_N1").innerHTML = "1";
document.querySelector(".sample02_Q1").innerHTML = "javascript";
document.querySelector(".sample02_M1").innerHTML = "toUpperCase()";
document.querySelector(".sample02_P1").innerHTML = currentStr1;

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

//01
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;

//02
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;

//03
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, 2); // a
const currentStr9 = str1.slice(1, 3); // av
const currentStr10 = str1.slice(1, 4); // avs
const currentStr11 = str1.slice(-1); // e
const currentStr12 = str1.slice(-2); // ce
const currentStr13 = str1.slice(-3); // nce
const currentStr14 = str1.slice(-2, -1); // c (뒤에서 부터 시작한다.)
const currentStr15 = str1.slice(-3, -2); // nc
const currentStr16 = str1.slice(-3, -3); // 아무것도 나오지 않는다.
            
const currentStr17 = str1.slice(1, 4); // ava
const currentStr18 = str1.slice(4, 1); // 아무것도 나오지 않는다.
            
const currentStr19 = str1.substring(4, 1); // ava (()의 숫자 위치를 제대로 작동하게 자동으로 바꿔준다.)
const currentStr20 = str1.substring(1, 4); // ava
            
const currentStr21 = str1.substr(0); // javascript reference
const currentStr22 = str1.substr(1); // avascript reference
const currentStr23 = str1.substr(2); // vascript reference
const currentStr24 = str1.substr(0, 1); // j
const currentStr25 = str1.substr(0, 2); // ja
const currentStr26 = str1.substr(0, 3); // jav
const currentStr27 = str1.substr(1, 2); // av
const currentStr28 = str1.substr(1, 3); // ava
const currentStr29 = str1.substr(1, 4); // avas
const currentStr30 = str1.substr(-1); // e
const currentStr31 = str1.substr(-2); // ce
const currentStr32 = str1.substr(-3); // nce
const currentStr33 = str1.substr(-1, 1); // e
const currentStr34 = str1.substr(-2, 2); // ce
const currentStr35 = str1.substr(-3, 3); // nce

const str1 = "javascript reference";
const currentStr1 = str1.split(''); // (20) ['j', 'a', 'v', 'a', 's', 'c', 'r', 'i', 'p', 't', ' ', 'r', 'e', 'f', 'e', 'r', 'e', 'n', 'c', 'e']
const currentStr2 = str1.split(' '); // (2) ['javascript', 'reference'] 한칸을 띄어서 출력하게 되면 단어로 출력한다.
const currentStr3 = str1.split('', 1); // ['j']
const currentStr4 = str1.split('', 2); // (2) ['j', 'a']
const currentStr5 = str1.split('',  1); // ['j']
const currentStr6 = str1.split('',  2); // (2) ['j', 'a']
const currentStr7 = str1.split('j'); // (2) ['', 'avascript reference'] j만 빠지고 출력이 된다. (j 칸은 빈 칸)
const currentStr8 = str1.split('a'); // (3) ['j', 'v', 'script reference'] a만 빠지고 나머지는 문자로 출력
const currentStr9 = str1.split('e'); // (5) ['javascript r', 'f', 'r', 'nc', ''] e만 빠지고 나머지는 문자로 출력
            
const str2 = "java/script/refer/ence";
const currentStr10 = str2.split('');
            
const str3 = "java&script&refer!ence";
const currentStr11 = str3.split('!'); // (2) ['java&script&refer', 'ence']
const currentStr12 = str3.split('&'); // (3) ['java', 'script', 'refer!ence']
const currentStr13 = str3.split(/&|\!/); // (4) ['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().join(); // e,c,n,e,r,e,f,e,r, ,t,p,i,r,c,s,a,v,a,j (배열이 사라지고 문자열로 출력한다.{반대로 출력})
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 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 (가장 첫 번째의 e가 E로 바뀐다.)
const currentStr4 = str1.replaceAll("e", "E"); // javascript rEfErEncE (모든 e가 E로 바뀐다.)
const currentStr5 = str1.replace(/e/g, "E"); // javascript rEfErEncE (졍규표현식 g로 e를 모두 찾아주어 E로 바꾼다.)
const currentStr6 = str1.replace(/e/gi, "E"); // javascript rEfErEncE (졍규표현식 g로 e를 모두 찾고, i는 소대문자를 구별하지 않는다. 그렇게 e를 대문자 E로 바꾼다.)
            
const str2 = "https://www.naver.com/img01.jpg";
            
const currentStr7 = str2.replace("img01.jpg", "img02.jpg");
            
const str3 = "010-2000-1000";
            
const currentStr8 = str3.replaceAll("-", ""); // 01020001000
const currentStr9 = str3.replace(/-/g, ""); // 01020001000
const currentStr10 = str3.replace("-", ""); // 0102000-1000
const currentStr11 = str3.replace(/-/g, "⭐️"); // 010⭐️2000⭐️1000
const currentStr12 = str3.replace(/[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
            
            
console.log(currentStr5);

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); // 456
const currentStr2 = str1.padStart(1, "0"); // 456
const currentStr3 = str1.padStart(2, "0"); // 456
const currentStr4 = str1.padStart(3, "0"); // 456 (길이 값이 3이기 때문에 여기까진 그대로 나온다.)
const currentStr5 = str1.padStart(4, "0"); // 0456 (원래 문자열의 길이를 넘어가게 되면 맨 앞에 뒤 문자열 0으로 남은 길이를 채운다.)
const currentStr6 = str1.padStart(5, "0"); // 00456
const currentStr7 = str1.padStart(6, "0"); // 000456
const currentStr8 = str1.padStart(6, "1"); // 111456
const currentStr9 = str1.padStart(6, "12"); // 121456
const currentStr10 = str1.padStart(6, "123"); // 123456
const currentStr11 = str1.padStart(6, "1234"); // 123456
const currentStr12 = str1.padStart(6, ""); //    456 (반환할 문자열을 쓰지 않으면 앞에는 공백으로 채워지게 된다.)
            
const currentStr13 = str1.padㄷEnd(1, "0"); // 456
const currentStr14 = str1.padㄷEnd(2, "0"); // 456
const currentStr15 = str1.padㄷEnd(3, "0"); // 456
const currentStr16 = str1.padㄷEnd(4, "0"); // 4560 (기본 문자열 뒤에 0이 추가된다.)
const currentStr17 = str1.padㄷEnd(5, "0"); // 45600
const currentStr18 = str1.padㄷEnd(6, "0"); // 456000
const currentStr19 = str1.padㄷEnd(6, "1"); // 456111
const currentStr20 = str1.padㄷEnd(6, "12"); // 456121
const currentStr21 = str1.padㄷEnd(6, "123"); // 456123
const currentStr22 = str1.padㄷEnd(6, "1234"); // 456123
const currentStr23 = str1.padㄷEnd(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 데이터가 없을 때는 -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)

//"문자열".search("검색값");
//"문자열".search("정규표현식");
            
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 데이터가 없을 때는 -1 이 나온다.
const currentStr8 = str1.search(/[a-z]/g); // 0
            
            
console.log(currentStr8);

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']

console.log(currentStr8);

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 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"); // true
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.startendsWithsWith("reference", 20); // true