문자열 활용
console.log('I'm Iron man'); Uncaught SyntaxError:
해결 방법: console.log("I'm Iron man") console.log("He said "I'm Iron man""); Uncaught SyntaxError:
해결 방법:
console.log("He said \"I'm Iron man\"");
console.log('He said "I\'m Iron man"');
console.log("He said \"I\'m Iron man"");
console.log('He said \"I\'m Iron man\"');
역 슬래시(\)를 사용하면 가독성이 떨어지므로 다른 해결 방법을 고민해본다.
console.log(`He said "I'm Iron man"`);
(``)을 이용한다 문자열 덧셈은 문자열을 연결하라는 뜻
console.log('Hello' + 'world'); Helloworld
console.log('3' + '5'); 35 불 대수
일상적인 논리를 수학적으로 표현한 것
일반 수학의 값은 숫자이지만 불 대수의 값은 진리값이다. (진리값= True or False)
일반 수학의 연산은 사칙연산이지만 불 대수의 연산은 and or not 3가지 연산이다.
불 대수를 정확히 하려면 명제에 대한 이해가 필요하다. 명제란 '참과 거짓이 확실한 문장을 말한다.
AND 연산 (&&: and연산자)
x와 y가 모두 참일 때만 x and y가 참
x y x and y
true true true
true false false
false true false
false false false
예: 대한민국의 수도는 서울이다. and 2는 1보다 크다.
(대한민국의 수도는 서울이고, 2는 1보다 크다. // true )
대한민국의 수도는 서울이다. and 2는 1보다 작다.
(true and false // false)
OR 연산 (||: or연산자)
x와 y중 하나라도 참이면 x or y가 참
x y x or y
true true true
true false true
false true true
false false false
예: 대한민국의 수도는 제주도다. or 대한민국의 수도는 서울이다.
(대한민국의 수도는 제주도거나 서울이다. //true)
대한민국의 수도는 제주도다. or 대한민국의 수도는 부산이다.
(false or false // false)
NOT 연산 (!: not연산자)
x NOTx
true false
false true
예: NOT 대한민국의 수도는 서울이다. // false
불린형(Boolean)
자바스크립트에서 참과 거짓을 표현하는 자료형을 불린이라고 한다.
console.log(2>1); true
console.log(2<1); false 자바스크립트에서 불린의 두 값은 소문자 true 아니면 false이다.
typeof 연산자
내가 지금 사용하고 있는 값이 어떤 자료형인지 확인할 수 있는 연산자
typeof 값 ; 이 값을 평가해서 해당하는 자료형을 문자열로 되돌려준다.
console.log(typeof 101); number
console.log(typeof 'Hello'); string
console.log(typeof true); boolean
console.log(tyepof 1); number
console.log(typeof 1.0); number (자바스크립트는 소수와 정수 따로 구별하지 않음)
console.log(typeof '1'); string
console.log(typeof "1"); string
console.log(typeof `1`); string
단순한 값 뿐 아니라 변수와 함수에서도 활용할 수 있다.
let name = 'Ironman';
function yourName(){
console.log('Hello');
};
console.log(typeof name); string
console.log(typeof yourName); function typeof 연산자는 사칙연산자보다 우선순위가 높다. 괄호(())를 이용해 우선순위를 표시해준다.
console.log(typeof 'Hello' + 'Ironman'); stringIronman
즉, typeof 'Hello'의 값인 string이 먼저 출력되고 거기에 사칙연산자 '+'가 적용된 것
console.log(typeof 8 -3); NaN
NaN = not a number 연산의 순서가 우리가 의도하지 않은 방식으로 실행된 것
즉 typeof8의 값 'number(문자열)'이 먼저 출력되고 -3을 연산하려고 하니 연산이 안된 것
console.log(typeof ('Hello' + 'Ironman') ; string
console.log(typeof (8-3)); number 형변환 (Type Conversion)
console.log('10' + '5') ; 105 (string)
console.log(10 + 5); 15 (number) 처음의 값으로 정해진 자료형을 다른 자료형으로 바꾸는 것을 말한다. 자바스크립트에서 기본으로 제공되는 함수(String, Number, Boolean)을 활용하면 된다.
console.log(Number('10') + Number('5')) ; 15 (number)
console.log(String(10) + String(5)); 105 (string) let x = '문자'
console.log(x); 문자
console.log(Number(x)); NaN
console.log(typeof x); string
console.log(typeof Number(x)); number
let y = true;
console.log(y); true
console.log(Number(y)); 1
let z = false;
console.log(z); false
console.log(Number(z)); 0 불린은 숫자로 형변환을 할때 숫자 1(true), 0(false)로 한다.
let x = '문자';
console.log(x); 문자
console.log(Boolean(x)); true 어떤 값을 불린으로 변환할때는 true값이 된다. 불린이 false로 나오는 경우를 알아두면 좋은데 '없거나, 비어있는' 느낌을 줄 때 false로 변환된다.(falsy값)
let x = '';
console.log(x);
console.log(Boolean(x)); false
let y = 0
console.log(Boolean(y)); false
let z = NaN
console.log(Boolean(z)); false console.log(Number('1' + '2' + '3') - Number(true)); 122
// 123 - 1 (true는 number로 변환시 1)
Boolean(6 % 2); false
6%2는 0이므로 산술 연산(+, -, *, /, %, **)
console.log(4 + '2'); 42 ('+'연산자는 문자열을 이어주는 역할이 조금 더 강하다)
console.log(4 + 2); 6
console.log(4 - true); 3 (형변환을 하지도 않았는데 알아서 숫자로 변환해 연산)
console.log(4 * false); 0 (마찬가지)
console.log(4/'2'); 2
console.log('4' ** true); 4 (이 아이도)
console.log(4 % 'two'); NaN
관계 비교 연산(<, <=, >, >=)
console.log(2 < '3'); true
console.log(2 > true); true
console.log('2' <== false); false
console.log('two' >= 1); false
관계 비교 연산에서는 결과가 True나 false가 나와야하는데
비교가 불가능한 경우에도 'false'가 출력된다. 같음 비교 연산(===, !==, ==, !=)
일치 비교는 형변환이 일어나지 않지만 동등비교는 숫자형태로 형변환이 일어난다. 동등과 부등은 형변환이 일어날 수 있기 때문에 특별한 경우가 아니라면 두 값이 서로 같은지를 비교할때는 등호 3개를 이용하는 것이 보다 안전한 코드를 작성하는데 도움이 된다.
console.log(1 === '1'); 일치, 불일치(!==) false
console.log(1 === true); false
console.log(1 == '1'); 동등, 부등(!=) true
console.log(1 == true); true
console.log(5 % 2 === Boolean(2) * true); true
5%2는 1 === Boolean(2)는 true이므로 true * true는 1 템플릿 문자열(${})
문자열을 연결할 때 '+'를 쓸수도 있지만 템플릿 문자열을 사용하면 더 편하게 코드 작성이 가능하다.
let year = 2020;
let month = 9;
let day = 3;
console.log('생년월일은' + year + '년' + month + '월' + day + '일입니다');
// 생년월일은 2020년 9월 3일입니다
생각보다 가독성이 떨어지는 코드, 변수를 활용하는 구간에 더하기를 매번 넣어주어야하는 불편함
템플릿 문자열을 활용하면 좀더 간단하게 코드 작성이 가능해진다.
console.log(`생년월일은 2020년 9월 3일입니다`);
console.log(`생년월일은 ${year(변수, 연산식 넣을 수 있음)}년 ${month}월 ${day}일 입니다`)
let myNumber = 3;
function getTwice(x){
return x * 2;
}
console.log(`${myNumber}의 두 배는 ${getTwice(myNumber)}입니다.`);
// 3의 두 배는 6입니다. null과 undefined
'값이 없다'는 것이지만 null은 값이 없다는 것을 의도적으로 표현할 때 사용하고 undefined는 코드를 실행하면서 값이 없다는 것을 확인할 때 사용된다.
let myName;
console.log(myName); //undefined
값이 주어지지 않은 변수에는 기본적으로 undefined값을 가지고 있다. 선언한 다음 값을 정해주지 않았다는 것을 의미한다. 지정된 값이 없다는 것을 확인할 수 있다.
myName = null;
console.log(myName); // null 의도적으로 없다는 의미를 지정할때 사용한다.
console.log(null == undefined); true
console.log(null === undefied); false undefined값을 직접 사용하는 것도 코드를 실행하는데는 전혀 지장이 없다.
let myName;
console.log(myName); undefined
myName = null;
console.log(myName); null
myName = undefined;
console.log(myName); undefined 헷갈리는 문제
let x;
console.log(x); undefined
let y = x; y에 undefined를 할당
x = null; x에 null을 선언했어도 y는 undefined 그대로
console.log(y); undefined
console.log(x); null
x = y; 변수 x에 y가 가지고 있는 undefined 할당
console.log(x); undefined 