프론트엔드 3일차~!(조건문과 문자열)

오늘도 페어 프로그램이 있긴했지만 저번에 했던 분이랑 같이 해서 부담감과 걱정이 덜했다. 페어 프로그램으로 코플릿 문제를 풀었는데 첫 날과는 다르게 시간이 꽤나 걸렸다. 17문제였는데 하나하나 풀어가는 성취감이 있어서 시간가는 줄 몰랐다.

 

오늘은 조건문과 문자열에 대해 배웠다. 

조건문

조건문은 조건문의 ()안의 조건이 true값이면 다음 {}안의 코드를 실행하고 ()안의 조건이 false값이면 다음 {}안의 코드를 실행하지 않는다. 조건문의 조건에는 비교연산자(<, >, =, <=, >=, ===, !==, !)가 필요하다.

 

첫 조건은 if를 사용하며 두번째 조건부터는 else if를 사용한다. else는 마지막에 쓰이며 어느 조건에도 속하지 않는 값들이 해당된다.

function vs(num) {
    if(num < 2) {
    	return `${num}은 2보다 작다.` //변수num의 값이 2보다 작을 경우 리턴
    } else if(num === 2) {
    	return `${num}은 2다.` //변수num의 값이 2일 경우 리턴
    } else {
    	return `${num}은 2보다 크다.` //변수num의 값이 2보다 클 경우 리턴
    }
}

위의 경우 argumet인 num에 3을 할당해주면 '3은 2보다 크다'가 리턴된다.

 

조건문 안에 조건문을 넣는 것도 가능하지만 논리연산자(&&, ||, !)를 사용하면 편리하다.

function vs(num) {
    if(5 < num && num < 10) { // &&은 and를 나타내는 논리연산자
    	return `${num}은 5초과이고 10미만이다.`
    } else if(num < 5 || 10 < num) { // ||은 or를 나타내는 논리연산자
    	return `${num}은 5미만이거나 10초과이다.`
    } else {
    	return `${num}은 5이거나 10이다.`
    }
}

!논리 연산자일 경우 truthy한 값을 falsy한 값으로 falsy한 값을 truthy한 값으로 값을 반전시킨다.

!true //false가 출력
!false //true가 출력

//! 여러번 사용가능
!!true //true가 출력
!!!false //true가 출력

 

문자열

값으로 할당된 문자열은 한글자 한글자 출력하는 것이 가능하다.

let str = 'hello new world';

console.log(str[0]); // 0자리에 있는 'h'가 출력
console.log(str[7]); // 7자리에 있는 'e'가 출력

문자열을 출력할 때 + 연산자를 사용가능하다. string 타입과 + 연산자를 사용하면 어떤 타입이든 string으로 출력된다.

console.log(1 + '1') // '11'로 출력
console.log(true + '1') // 'true1'로 출력

 

string method

str.indexOf()은 str변수 문자열에 ()안의 문자열이 존재하면 첫번째 위치가 표시된다.

let str = 'hello new world';

console.log(str.indexOf('new')); // 6이 출력
console.log(str.indexOf('llo')); // 2가 출력
console.log(str.indexOf('xib')); // 없는 경우 -1이 출력

 

str.lastIndexOf()은 str변수 문자열에 ()안의 문자열이 존재하면 마지막 위치가 표시된다.

let str = 'hello new world';

console.log(str.indexOf('o')); // 11이 출력
console.log(str.indexOf('l')); // 13이 출력
console.log(str.indexOf('x')); // 없는 경우 -1이 출력

str.includes()은 str변수 문자열에 ()안의 문자열의 존재 유무가 표시된다.

let str = 'hello new world';

console.log(str.includes('new')); // true가 출력
console.log(str.includes('llo')); // true가 출력
console.log(str.includes('xib')); // 없는 경우 false가 출력

str.split()은 str변수 문자열에 ()안의 문자열로 나누어 배열한다.

let str = 'hello new world';

console.log(str.split(' ')); // ['hello', 'new', 'world']가 출력

str.join()은 str변수 배열을 ()안의 문자열과 합쳐 문자열을 만든다.

let str = 'hello new world';
let strr = str.split(' '); //str을 배열로

console.log(strr.join(' ')); //배열을 문자열로 'hello new world'가 출력

str.substring()은 ()안의 첫번째 숫자부터 두번째 숫자까지의 문자열을 출력한다. 첫번째 숫자 위치의 문자열은 포함이 되고 두번째 숫자 위치의 문자열은 포함이 되지 않는다.

let str = 'hello new world';

console.log(str.substring(3, 7)); // 'lo n' 출력
console.log(str.substring(3)); // 'lo new world' 출력
console.log(str.substring(30)); //'' 출력

str.toLowerCase()는 모든 문자열을 소문자로 바꾼다.

let str = 'Hello New World';

console.log(str.toLowerCase()); // 'hello new world' 출력

str.toUpperCase()는 모든 문자열을 대문자로 바꾼다.

let str = 'Hello New World';

console.log(str.toLowerCase()); // 'HELLO NEW WORLD' 출력

 

코플릿 풀며 배운것들

거듭제곱 연산자 (a**, a*a, Math.pow(a, 2))

내림 (Math.floor())

반올림 (Math.round())

올림 (Math.ceil())

절대값 (Math.abs())