1. Operator
/*
* 연산자 관련 일반사항
*
* 연산 Operation
* 연산자 Operator
* 피연산자 Operand
*
* ■ 피연산자의 개수에 따라
* 이항연산자(binary operator) : 피연산자가 2개인 연산자
* 단항연산자(unary operator) : 피연산자가 1개인 연산자
* 삼항연산자(ternary operator) : 피연산자가 3개인 연산자
*
* ■ 피연산자의 타입에 따라 수행하는 연산이 달라지는 연산자들도 있다 (ex: + )
*
* ■ 모든 연산은 연산의 결과값을 리턴한다 (어떠한 '값'인지?, 어떤 '타입'인지? 주목)
*
* ■ 관례적으로 이항연산자는 피연산자와 연산자 간에 한칸씩(space) 띄어주는게 좋다
* 단항연산자는 피연산자와 연산자를 붙여주는게 일반.
*/
let num1, num2, num3, num4, num5, num6, num7, num8, num9, num10
/*
대입 연산자 assignment operator : =
등호(=) 오른쪽의 값을 왼쪽에 대입(저장)
산술 연산자 arithmetic operator :
+, -, *, / : 사칙연산
% : 나머지 연산자 (remainder)
** : 제곱연산자 (exponential) ES2016
*/
console.log('[대입연산자, 산술연산자]');
num1 = 7;
num2 = 3;
console.log(num1 + num2);
console.log(num1 - num2);
console.log(num1 * num2);
console.log(num1 / num2); // 2.3333...
console.log(4 / 2);
console.log(4 / 2.0);
// 제곱연산자 (ES7 등장)
console.log('-'.repeat(20));
console.log('[제곱연산자]');
console.log(2 ** 4);
console.log((-3) ** 3);
console.log(2 ** -1);
console.log(2 ** (1/2));
console.log((-1) ** (1/2)); // NaN : Not a Number
/*
복합대입연산자
+=, -=, *=, /=, %=, **=
*/
/*
부호연산자(+, -) sign operator
+: 부호 연산자(수의 부호(양,음)가 바뀌지 않음)
-: 부호 연산자(수의 부호(양,음)가 바뀜)
*/
/*
증감연산자 increment/decrement operator :
++변수: 변수의 값을 1 증가시켜서 저장
--변수: 변수의 값을 1 감소시켜서 저장
증감연산자: prefix(접두사), postfix(접미사)
접두사(prefix)인 경우에는, 증감(++, --)이 먼저 된 후 다른 연산자가 동작
접미사(postfix)인 경우에는, 다른 연산자 먼저 실행된 후 증감(++, --)가 동작
*/
/*
관계(비교) 연산자 Equality and Relational Operators
비교 연산의 결과를 참(true) 또는 거짓(false)으로 리턴하는 연산자
A < B: A는 B보다 작다
A > B: A는 B보다 크다
A >= B: A는 B보다 크거나 같다
A <= B: A는 B보다 작거나 같다
A == B: A와 B가 같다. ('값' 만 비교)
A != B: A와 B는 다르다. ('값' 만 비교)
A === B : A 와 B 는 '값' 과 '타입' 이 같다
A !== B : A 와 B 는 '값' 혹은 '타입' 이 다르다
*/
console.log('-'.repeat(20))
console.log('[비교연산자]')
console.log(10 == 10);
console.log(10 != 10);
console.log(10 == "10"); // true
console.log(10 === "10"); // false 값 + 타입 까지 비교
/* 논리 연산자 (logical operator) : &&, ||, !, ^
* A && B: (AND 연산) A와 B가 모두 참일 때만 결과가 true, 나머지는 결과가 false
* A || B: (OR 연산) A나 B 둘 중 하나가 참이면 결과가 true, 둘 다 거짓이면 결과가 false
* !A : (NOT 연산) A가 참이면 결과가 false, 거짓이면 결과가 true
*/
// console.log('-'.repeat(20))
// console.log('[논리 연산자]')
/*
비트연산자 (bitwise operator)
JS의 비트연산자는 32bit number 에 대해 연산한다
비트연산자의 피연산자는 32bit number 로 변환된뒤 비트연산수행하고
그 결과는 다시 JS number 타입으로 리턴된다.
a & b: (and) a,b가 모두 1 이면 결과도 1, 그 외에는 0
a | b: (or) a가 1이거나 또는 b가 1이면 결과는 1, a,b 모두 0일 때만 0
a ^ b: (xor) a와 b 둘 중 하나만 1이 있는 경우는 1, 그 외에는 0
결국 둘이 같으면 0, 다르면 1
~a : (not) a가 1이면 0, a가 0이면 1로 바꿔줌
a >> n : right shift 비트를 오른쪽으로 n 비트씩 이동
a << n : left shift 비트를 왼쪽으로 n 비트씩 이동
*/
console.log("\n[프로그램 종료]", '\n'.repeat(20));
2. DataType
/*
JS의 자료형(data type) : https://www.w3schools.com/js/js_datatypes.asp
타입
https://www.w3schools.com/js/js_typeof.asp
값을 갖고 있는 5개 타입
number : 숫자 타입
string : 문자열 타입
boolean : 논리 타입 (true, false)
object : 객체 타입
function : 함수 타입
6가지 object 타입
Object : 객체
Array : 배열
Date
String
Number
Boolean
값을 갖고 있지 않은 타입 2가지
undefined : 타입이 지정되지 않음
null : 데이터가 없는 object
JS 는 dynamic type 을 지원하는 언어다.
*/
console.log('-'.repeat(20));
console.log('[number, string, undefined]');
let x;
console.log('x =', x, typeof x);
x = 5;
console.log('x =', x, typeof x);
x = 'John';
console.log('x =', x, typeof x);
x = false;
console.log('x =', x, typeof x);
x = undefined;
console.log('x =', x, typeof x);
// JS 의 문자열 리터럴, 홀따옴표, 쌍따옴표 가능
x = 'JavaScript';
console.log('x =', x, typeof x);
x = "JavaScript";
console.log('x =', x, typeof x);
console.log();
x = "10" + 10;
console.log('x =', x, typeof x); // "1010"
x = "10" * 10; // 100(number) 헐.... 이건 왜 number 형변환이 되는데?
console.log('x =', x, typeof x);
x = "10" - 2
console.log('x =', x, typeof(x));
x = "10" / 2
console.log('x =', x, typeof(x));
x = "10" > 2
console.log('x =', x, typeof(x));
x = "10" > "2"
console.log('x =', x, typeof(x)); // false 문자열 코드값 비교
x = "a" * 10;
console.log('x =', x, typeof(x));
x = 10 / 0;
console.log('x =', x, typeof(x));
/*
* 배열 (array)
*
* [ .. ] bracket 으로 감싸고
* 그 안에 배열 원소(item) 들이 콤마로 나열됨.
*/
console.log('-'.repeat(20));
console.log('array (배열)');
x = [10, 20, 30];
console.log('x =', x, typeof(x));
console.log('x[0] =', x[0], typeof(x[0]));
console.log('x[3] =', x[3], typeof(x[3])); // index 벗어나면 undefined! <- 에러 아님
console.log('x.length =', x.length);
x = [
100,
200,
300, // <-- 마지막 원소 뒤의 콤마 OK
400,
];
/*
* 오브젝트, 객체 (object)
* { .. } curly brace 로 감싸고
* name:value 쌍이 콤마로 구분되어 나열됨.
* name:value 쌍 을 object 의 property 라고 한다.
*/
console.log('-'.repeat(20))
console.log('[object (오브젝트)]')
x = {firstName:"박", lastName:"준우", age:28, eyeColor:"blue"};
console.log('x =', x, typeof(x));
// property name 을 사용하여 value 접근
console.log(x['firstName']); // 방법1
console.log(x.firstName); // 방법2
console.log(x.address); // 없는 property =>? undefined
// empty 배열
x = []
console.log(x, x.length);
// empty object
x = {}
console.log(x);
// null
x = null;
console.log('x =', x, typeof(x));
// 따라서,
// undefined, NaN, null ... 이런게 출력된다면
// 뭔가 잘못 만들고 있다는 뜻!
3. Template Literal
/*
Template Literal 문법 (ES6 등장)
ES6 에는 문자열 조합을
편리하게 할수 있는 방법 제공
'이전에는 Template String이라 불렸지만
'ES2015 명세서 부터는 Template Literal 이라 부름
backtick (`) 문자 사용한 문자열 포맷팅
문자열 안에서 ${변수}
문자열 안에서 ${값}
이와같이 불리기도 한다]
Template Literals
Template Strings
String Templates
Back-Tics Syntax
*/
let myName;
myName = '아이언맨';
console.log('Hello, ' + myName + "!");
console.log(`Hello, ${myName}!`);
// let x = "동해물과
// 백두산이";
// 리터럴내 줄바꿈 가능
let x = `동해물과 백두산이
마르고 닳도록
하느님이 보우하사
우리나라만세`;
console.log(x);
//-------------------------------------------------------
x = {name: "John", age: 40};
console.log(x);
// {key: 'value' } <-- console.log() 는 object '단독' 출력시 이쁘게 '출력'해준다
// 절.대.로 toString() 의 결과값이 아닙니다. (※ 파이썬의 __str__() 에 해당하는게 toString() )
console.log('x =', x)
// 모든 object 는 자신을 문자열로 표현하는 toString() 메소들를 제공.
// 기본적으로 object 의 toString() 결과값은 "[object Object]"
console.log('x = ' + x); // toString() 결과값와 문자열 연결
console.log(`x = ${x}`);
// template literal 도 내부적으로 문자열 연결연산(+)
// => 'x = ' + x.toString()
Junior Backend Developer