오늘의 Checkpoint

조건문 Conditional expression

참, 거짓 여부에 따라 값을 거르는 표현식
조건에 따라 실행
-> 비교의 결과는 boolean으로 표현(true/false)

• 비교연산자 comparsion operator

  >, <, >=, <=. ===, !==
  cf. 엄격한 비교를 위해 ==, !=를 사용하지 않음

ex. 'true' === true // false
	'1' == 1 // true
	'1' === 1 // false
	null == undefined // true
	null === undefined // false
	[1] == true // true

조건문 형식

조건은 boolean타입으로 산출되는 값을 사용

if(조건1){
  //조건 1이 참일 때 실행
} else if (조건2){
  // 조건 1이 거짓 + 조건2 참일 때 실행
} else{
  // 조건1, 조건2 둘다 거짓일 때 실행
}

논리 연산자 logical operator

조건이 2가지 이상일 때 사용하는 연산자

&& (and연산자)
: 비교하는 조건이 둘다 truthy할 때 true, 나머지 경우엔 false

true && true // true /*point!!!*/
true && false // false
false && false // false

|| (or 연산자)
: 둘다 falsy하지 않을 때 false, 하나라도 truthy한 경우엔 true

true || true // true
true || false // true
false || false // false /*point!!!*/

! (not 연산자)
: trusy, flasy값 반전, !를 2개 이상 반복하여 사용가능

!false // true
!(4<5) // false
!undefined // true
!"hello" // false
/* 빈문자열을 제외항 문자열은 true반환 */

falsy로 표현되는 6가지 형태
false, null, undefined, 0, NaN(Not a Number), ''(빈문자열)
-> 조건문에서 실행되지 않음

console.log('hello' === 'world')
// 문자열은 true라는 상태만 생각하고 true를 예상했으나 타입만 고려해서 잘못된 예상

let isStudent = true;
let isFemale = true;

console.log(isStudent || !isFemale)
console.log(!!isStudent===isStudent);
console.log(!!!isStudent);

문자열 string

''따옴표나 ""큰따옴표를 사용하여 표기
대소문자 구분됨
cf. 문자character(하나) char

• 문자열 메서드는 immutable로 원본의 값이 수정X
• typeof 연산자를 사용하여 타입 확인
  
  

문자열의 특징

• 단일문자 접근
  -> str[index]
  read-only, 수정 불가 -> immutable
  cf. 수정하려면 전체 문자열을 재할당하여 사용

	let str = "CodeStates";
    str[0] = "G"; // 에러가 발생X
    console.log(str); // 'CodeStates'

• +연산자로 문자열 연결
  다른 타입일 경우에도 문자열로 인식하여 연결

    let str3= "1";
	console.log(str3+7); // "17"
	console.log('1'+true) // "1true"
	console.log("1"+[1,2,3]) // "11,2,3"

문자열의 프로퍼티, 메서드

프로퍼티

length
: 문자열의 전체 길이

메서드
문자열의 메서드는 immutable -> 원본이 변하지 않음
cf. 배열의 일부 메서드는 mutable

indexOf(serchValue)
: serchValue가 있는 앞에서 첫번째 인덱스를 반환
lastIndexOf(serchValue)
: 뒤에서 첫번째 인덱스를 반환
includes(serchValue)
: 위치보다 단순히 존재 여부 조회. 값이 있는경우 true 즉, boolean으로 반환

let bWhale = "Blue Whale"
bWhale.indexOf("Blue") // 0
bWhale.indexOf("blue") // 값이 없으면 -1 반환
bWhale.indexOf("WHale") // 5
bWhale.lastIndexOf("e"); // 9
bWhale.includes("blue") // false
/*
값이 없으면 -1 반환
찾고자하는 문자열이 여러개라면 처음 하나의 인덱스만 반환
indexOf: 앞
lastIndexOF: 끝
*/

split(seperator)
: seperator를 기준으로 분리하여 배열로 반환
cf. CSV(comma-separated values. 콤마로 정보를 분리한 문자열) 형식에 많이 사용

let str = "대한민국, 서울시, 성북구";
str.split(" "); // 공백기준 -> ['대한민국,', '서울시,', '성북구']

let alphabet = 'abcdefghijklmnopqrstuvwxyz';
alphabet.split(''); // ['a', 'b', 'c', 'd', ..(생략).. , 'u', 'v', 'w', 'x', 'y', 'z']

let fruits = '사과, 바나나, 오렌지, 배, 감, 딸기';
let word = fruits.split(', ');
console.log(word);
/*
fruits.split(', '); 
-> ['사과', '바나나', '오렌지', '배', '감', '딸기']
fruits.split(','); 
-> ['사과', ' 바나나', ' 오렌지', ' 배', ' 감', ' 딸기']
*/

let csv = `연도,제조사,모델,설명,가격
1997,Ford,E350,"ac, abs, moon",3000.00
1999,Chevy,"Venture ""Extended Edition""","",4900.00
1999,Chevy,"Venture ""Extended Edition, Very Large""",,5000.00
1996,Jeep,Grand Cherokee,"MUST SELL!air, moon roof, loaded",4799.00`;
let lines = csv.split('\n'); // 줄바꿈 기준 -> 길이5인 배열
lines[0]; // '연도,제조사,모델,설명,가격'
lines[1].split(','); // ['1997', 'Ford', 'E350', '"ac', ' abs', ' moon"', '3000.00']

substring(start, end 혹은 end, start)
: 전체 문자열 중 일부분만 추출
end값의 위치는 포함하지 않음

let str = 'abcdefghijklmn';
str.substring(5,2); // 'cde'
str.substring(-4,2); // 'ab', 음수는 0부터 시작
str.substring(0,30); // 범위를 넘어가면 문자열 끝까지만 추출

slice(start, end)
: 문자열의 일부를 추출
배열에도 사용할 수 있는 메서드
end값의 위치는 포함하지 않음

const str = 'The quick brown fox';
str.slice(2,8) // 'e quic' take의미
str.slice(8) // 'k brown fox' drop의미

-> 차이점 바로가기

toUpperCase() : 문자열을 대문자로 변환
toLowerCase() : 문자열을 소문자로 변환

let word = "I am Groot!!";
word.toUpperCase(); // 'I AM GROOT!!'
word.toLowerCase(); // 'i am groot!!'

let hi = "hello";
hi.toUpperCase(); // 'HELLO'
hi; // 'hello'
/* 
문자열의 메서드는 immutable하기 때문에 
메서드를 사용한 후 원본이 변하지 않음
*/

concat(addStr)
: 문자열에 argument로 입력받은 값을 이어붙여 새로운 문자열을 반환
cf. + 연산자의 처리 속도가 concat메서드 보다 빠른편

• immutable 메서드

str1.concat(str2,str3, ....);
// arguments가 문자열이 아닌 경우 문자열로 변환하여 이어붙임

let str1 = 'hello!';
let str2 = 'good morning'

str1.concat(str2) // 'hello!good morning'
str1.concat(' ', str2) // 'hello! good morning'

"".concat({}); // [object Object]
"".concat([]); // ""
"".concat(null); // "null"

Template string(template literal)

표현식(expression)을 포함해 문자열을 표현하는 방식을 검색해 봅니다. (js template string 또는 js template literal
작은따옴표가 아닌 백틱` 사이에 문자와 ${변수}를 혼용하여 문자열속에 변수를 대입할 수 있는 방식

Recheck

// word의 값 비교

// case 1
function returnWordWithJoy(word) {
  if (typeof word !== 'string') {
    return 'wrong type';
  } else {
    return word + '!';
  }
}
let word = returnWordWithJoy(); 
console.log(word); // 'wrong type'

// case 2
let word;
function returnWordWithJoy(word) {
  if (typeof word !== 'string') {
    return 'wrong type';
  } else {
    return word + '!';
  }
}
returnWordWithJoy("I love coding"); 
console.log(word); // undefined

참고

parseInt()

문자열을 n진수의 정수로 반환

parseInt(string, radix)
// string : 숫자로 변경할 문자열
//          만약, 숫자와 문자가 섞인 경우 문자 이전까지만 파싱
//         -> 첫 문자를 숫자로 변환할 수 없을 때 NaN 반환
// radix : n진수로 변경할지 입력(생략 가능) 
//        -> 2~36진수(10진수 기본 X) 

parseInt("10"); // 10
parseInt("423-0-567"); // 423
parseInt("string") // NaN
parseInt("2string"); // 2

Math.abs()

Math 객체의 메서드로 절대값 반환
양수라면 그대로, 음수라면 -를 제거한 값으로 반환

Math.abs(-2); // 2
Math.abs(null); // 0
Math.abs(''); // 0
Math.abs({}); // NaN

Math.abs([]); // 0
Math.abs([2]); // 2
Math.abs([1,2]); // NaN

**