// Promise 객체를 리턴하는 함수
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(ms);
},ms);
});
}
// Promise 객체를 이용해서 비동기 로직을 수행할 때
p(1000).then((ms) => {
console.log(`${ms} ms 후에 실행된다.`);
});
// Promise 객체를 리턴하는 함수를 await 로 호출하는 방법
const ms = await p(1000);
console.log(`${ms} ms 후에 실행된다.`);
결과
이러한 에러가 발생하는데 아래에서 해결한다
async function안에 없어서 이런 에러가 발생한 것이다.
// await 를 사용하는 경우, 항상 async 함수 안에서 사용되어야 한다.
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(ms);
},ms);
});
}
(async function main() {
const ms = await p(1000);
console.log(`${ms} ms 후에 실행된다.`);
})();
결과
1000ms후에 실행됨
// Promise 객체가 rejected 된 경우의 처리를 위해
// try catch 를 이용한다.
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
// resolve(ms);
reject(new Error('reason1'));
},ms);
});
}
(async function main() {
try {
const ms = await p(1000);
//
} catch (error) {
console.log(error);
}
})();
결과
1000ms후에 실행됨
// async function 에서 return 되는 값은
// Promise.resolbe 함수로 감싸서 리턴된다.
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
// resolve(ms);
reject(new Error('reason1'));
},ms);
});
}
async function asyncP() {
return 'Mark';
}
(async function main() {
try {
const name = await asyncP();
console.log(name);
} catch (error) {
console.log(error);
}
})();
결과
// async function 에서 return 되는 값은
// Promise.resolve 함수로 감싸서 리턴된다.
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(ms);
//reject(new Error('reason1'));
},ms);
});
}
async function asyncP() {
const ms = await p(1000);
return 'Mark';
}
(async function main() {
try {
const name = await asyncP();
console.log(name);
} catch (error) {
console.log(error);
}
})();
결과
1000ms 후에 출력된다
// error의 전파
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
// resolve(ms);
reject(new Error('reason1'));
},ms);
});
}
async function asyncP() {
const ms = await p(1000);
return 'Mark';
}
(async function main() {
try {
const name = await asyncP();
console.log(name);
} catch (error) {
console.log(error);
}
})();
결과
1000ms 후에 에러 출력됨
// finally
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
// resolve(ms);
reject(new Error('reason1'));
},ms);
});
}
async function asyncP() {
const ms = await p(1000);
return 'Mark';
}
(async function main() {
try {
const name = await asyncP();
console.log(name);
} catch (error) {
console.log(error);
} finally {
console.log('end');
}
})();
결과
1000 ms후에 에러메시지와 finally 안의 end까지 출력된다
// finally
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(ms);
// reject(new Error('reason1'));
},ms);
});
}
async function asyncP() {
const ms = await p(1000);
return 'Mark : ' + ms;
}
(async function main() {
try {
const name = await asyncP();
console.log(name);
} catch (error) {
console.log(error);
} finally {
console.log('end');
}
})();
결과
1000ms 후에 결과와 finally안의 end까지 출력됨
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(ms);
// reject(new Error('reason1'));
},ms);
});
}
// Promise
p(1000).then(() => p(1000)).then(p(1000)).then(() => {
console.log('3000 ms 후에 실행 ');
});
//async await
(async function main() {
await p(1000);
await p(1000);
await p(1000);
console.log('3000 ms 후에 실행 ');
})();
결과
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(ms);
},ms);
});
}
//Promise.all
(async function main() {
const results = await Promise.all([p(1000), p(2000), p(3000)]);
console.log(results);
})();
/*
ES6 부터 JavaScript 의 표준 내장 객체로 추가 되었습니다.
ES6 를 지원하는 브라우저나 Node.js에서 전역에 있는 Promise 를 확인할 수 있습니다.
*/
console.log(Promise);
결과
/*
생성자를 통해서 프로미스 객체를 만들 수 있습니다.
생성자의 인자로 executor 라는 함수를 이용합니다.
*/
new Promise(/* executor */);
/*
executor 함수는 resolve와 rejuect 를 인자로 가집니다.
(resolve, reject) => { ... }
resolve 와 reject 는 함수 입니다.
resolve(), reject()
*/
new Promise(/* executor */ (resolve,reject) => {});
/*
생성자를 통해서 프로미스 객체를 만드는 순간 pending (대기) 상태라고 합니다.
*/
new Promise((resolve, reject) => {}); // pending
/*
executor 함수 인자 중 하나인 resolve 함수를 실행하면, fulfilled (이행) 상태가 됩니다.
*/
new Promise((resolve,reject) => {
//
// ...
resolve(); // fulfilled (이행된 상태로 돌입)
})
/*
executor 함수 인자 중 하나인 reject 함수를 실행하면, rejected(거부) 상태가 된다.
*/
new Promise((resolve, reject) => {
reject(); // rejected상태
});
/*
p라는 프로미스 객체가 fulfilled 되는 시점에 p.then 안에 설정한 callback 함수가 실행됩니다.
*/
const p = new Promise((resolve, reject) => {
/* pending */
setTimeout(() => {
resolve(); /* fulfilled */
},1000);
});
p.then(/*callback */);
/*
p.then 으로 callback 함수를 설정했기 때문에 fulfilled 되면서 callback 이 샐행됩니다.
*/
const p = new Promise((resolve, reject) => {
/* pending */
setTimeout(() => {
resolve(); /* fulfilled */
},1000);
});
p.then(() => {
console.log('1000ms 후에 fulfilled 됩니다.')
});
결과
실행시키면 1000ms 후에 결과문이 나온다.
/*
then을 설정하는 시점을 정확히하고,
함수의 실행과 동시에 프로미스 객체를 만들면서 pending 이 시작되도록 하기 위해
프로미스 객체를 생성하면서 리턴하는 함수 (p)를 만들어 함수 (p)실행과 동시에 then을 설정합니다.
*/
function p() {
return new Promise((resolve, reject) => {
/* pending */
setTimeout(() => {
resolve(); /* fulfilled */
},1000);
});
}
p().then(() => {
console.log('1000ms 후에 fulfilled 됩니다.');
});
결과
실행시키면 1000ms 후에 결과문이 나온다.
/*
마찬가지로 프로미스 객체가 rejected 되는 시점에 p.catch 안에 설정한 callback 함수가 실행된다.
*/
function p() {
return new Promise((resolve, reject) => {
/* pending */
setTimeout(() => {
reject(); /*rejected */
},1000);
});
}
p().then(() => {
console.log('1000ms 후에 fulfilled 됩니다.');
}).catch(() => {
console.log('1000ms 후에 rejected 됩니다.');
});
결과
실행시키면 1000ms 후에 결과문이 나온다.
/*
executor 의 resolve 함수를 실행할때 인자를 넣어 실행하면, then 의 callback 함수의 인자로 받을수 있습니다.
resolve('hello);
then((message) => {...})
*/
function p() {
return new Promise((resolve, reject) => {
/* pending */
setTimeout(() => {
resolve('hello');
},1000);
});
}
p().then((message) => {
console.log('1000ms 후에 fulfilled 됩니다.', message);
}).catch(() => {
console.log('1000ms 후에 rejected 됩니다.');
});
결과
/*
마찬가지로, executor 의 reject 함수를 실행할때 인자를 넣어 실행하면, catch 의 callback 함수의 인자로 받을 수 있습니다.
reject('error');
then((reason) => {...})
*/
function p() {
return new Promise((resolve, reject) => {
/* pending */
setTimeout(() => {
reject('error');
},1000);
});
}
p().then((message) => {
console.log('1000ms 후에 fulfilled 됩니다.', message);
}).catch((reason) => {
console.log('1000ms 후에 rejected 됩니다.', reason);
});
결과
1초후에 에러 메세지가 뜬다
/*
보통 reject함수를 실행하며 rejected 되는 이유를 넘기는데, 표준 내장 객체인 Error 의 생성자를 이용하여 Error 객체를 만듬
*/
function p() {
return new Promise((resolve, reject) => {
/* pending */
setTimeout(() => {
reject(new Error('bad'));
},1000);
});
}
p().then((message) => {
console.log('1000ms 후에 fulfilled 됩니다.', message);
}).catch((error) => {
console.log('1000ms 후에 rejected 됩니다.', error);
});
결과
1000ms 후에 만들어진 Error객체를 반환한다
/*
fulfilled 되거나 rejected 된 후에 최종적으로 실행할 것이 있다면, .finally() 를 설정하고, 함수를 인자로 넣습니다.
*/
function p() {
return new Promise((resolve, reject) => {
/* pending */
setTimeout(() => {
reject(new Error('bad'));
},1000);
});
}
p().then((message) => {
console.log('1000ms 후에 fulfilled 됩니다.', message);
}).catch((error) => {
console.log('1000ms 후에 rejected 됩니다.', error);
})
.finally(() => {
console.log('end');
});
결과
/*
보통 비동기 작업을 할떄, callback 함수를 인자로 넣어 로직이 끝나면 callback 함수를 호출합니다.
이런 경우 함수가 아래로 진행되지 않고, callback 함수 안으로 진행됩니다.
*/
//callback처리하는 방법
function c(callback) {
setTimeout(() => {
callback();
}, 1000);
}
c(() => {
console.log('1000ms 후에 callback 함수가 실행됩니다.');
});
c(() => {
c(() => {
c(() => {
console.log('3000ms 후에 callback 함수가 실행됩니다.');
});
});
});
결과
1초후에 첫번째 줄이 출력되고 3초후에 두번째 줄이 출력된다
/*
then 함수에서 다시 프로미스 객체를 리턴하는 방법을 통해 체이닝하면, 비동기 작업을 순차적으로 아래로 표현할 수 있습니다.
then 에 함수를 넣는 여러 방법을 확인해 봅시다.
*/
function p() {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve();
},1000)
});
}
p().then(() => {
return p();
})
.then(() => p())
.then(p)
.then(() => {
console.log('4000ms 후에 fulfilled됩니다.')
})
결과
4000ms후에 출력된다
/*
value가 프로미스 객체인지 아닌지 알 수 없는 경우, 사용하면 연결된 then 메서드를 실행합니다.
value가 프로미스 객체면, resolve 된 then 메서드를 실행 합니다.
value가 프로미스 객체가 아니면, value를 인자로 보내면서 then 메서드를 실행합니다.
*/
Promise.resolve(/* value */);
Promise.resolve(
new Promise((resolve, reject) => {
setTimeout(() => {
resolve('foo');
}, 1000);
}),
).then((data) => {
console.log(
'프로미스 객체인 경우, resolve 된 결과를 받아 then 이 실행됩니다.',
data,
);
});
Promise.resolve('bar').then(data => {
console.log('then 메서드가 없는 경우, fulfilled 됩니다.', data);
});
결과
/*
Promise.reject 를 사용하면, catch 로 연결된 rejected 상태로 변경됩니다.
*/
Promise.reject(/* value */);
Promise.reject(new Error('reason'))
.then(error => {})
.catch(error => {
console.log(error);
});
결과
/*
프로미스 객체 여러개를 생성하여,
배열로 만들어 인자로 넣고 Promise.all 을 실행하면,
배열의 모든 프로미스 객체들이 fulfilled 되었을 때, then 의 함수가 실행된다.
then 의 함수의 인자로 프로미스 객체들의 resolve 인자값을 배열로 돌려준다.
*/
//Promise.all([프로미스 객체들]);
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve();
},ms)
})
}
Promise.all([p(1000), p(2000), p(3000)]).then(() => {
console.log('모두 fulfilled 된 이후에 실행됩니다.');
})
결과
3000ms후에 출력된다
/*
프로미스 객체 여러개를 생성하여,
배열로 만들어 인자로 넣고 Promise.all 을 실행하면,
배열의 모든 프로미스 객체들이 fulfilled 되었을 때, then 의 함수가 실행된다.
then 의 함수의 인자로 프로미스 객체들의 resolve 인자값을 배열로 돌려준다.
*/
//Promise.all([프로미스 객체들]);
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(ms);
},ms)
})
}
Promise.all([p(1000), p(2000), p(3000)]).then((messages) => {
console.log('모두 fulfilled 된 이후에 실행됩니다.', messages);
})
결과
3000ms후에 출력된다
/*
프로미스 객체 여러개를 생성하여,
배열로 만들어 인자로 넣고 Promise.race 를 실행하면,
배열의 모든 프로미스 객체들 중 가장 먼저 fulfilled 된 것으로, then 의 함수가 실행됩니다.
then 의 함수의 인자로 가장 먼저 fulfilled 된 프로미스 객체의 resolve 인자값을 돌려줍니다.
*/
// Promise.race([프로미스 객체들]);
function p(ms) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(ms);
},ms)
})
}
Promise.race([p(1000), p(2000), p(3000)]).then((messages) => {
console.log('가장 빠른 하나가 fulfilled 된 이후에 실행됩니다.', messages);
})
//class
// 선언적 방식
class A {}
console.log(new A());
// class 표현식을 변수에 할당
const B = class {};
console.log(new B());
// 선언적 방식이지만 호이스팅은 일어나지 않는다.
new C();
class C {}
결과
// constructor
class A{}
console.log(new A());// 객체 생성
// B객체를 만들면 안에 있는 constructor() 가 실행됨
class B{
constructor() {
console.log('constructor');
}
}
console.log(new B());
class C {
constructor(name, age){
console.log('constructor', name, age);
}
}
console.log(new C('Mark', 27));
console.log(new C());
결과
class C의 constructor의 매개변수에 값을 안넣어주면 undefined로 출력되게 된다.
// 멤버 변수
class A {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
console.log(new A('Mark', 27));
// class field 는 런타임 확인
class B {
name;
age;
}
console.log(new B());
class C {
name = 'no name';
age = 0;
constructor(name, age) {
this.name = name;
this.age = age;
}
}
console.log(new C('Mark', 27));
결과
B는 name과 age를 초기화 해주지 않고 호출해서 undefined로 나옴
// 멤버 함수
class A {
hello1() {
console.log('hello1', this);
}
hello2 = () => {
console.log('hello2', this);
};
}
new A().hello1();
new A().hello2();
class B {
name = 'Mark';
hello() {
console.log('hello', this.name);
}
}
new B().hello();
결과
// get, set
class A {
_name = 'no name';
get name() {
return this._name + '@@@';
}
set name(value) {
this._name = value + '!!!';
}
}
const a = new A();
console.log(a);
a.name = 'Mark'; // setter
console.log(a);
console.log(a.name); // getter
console.log(a._name);
//readonly
class B {
_name = 'no name';
get name() {
return this._name + '@@@';
}
}
const b = new B();
console.log(b);
b.name = 'Mark'; // 클래스B안에 setter함수가 없기 때문에 name에 'Mark'가 초기화 되지 않음
console.log(b);
결과
클래스를 new()를 사용해서 객체를 생성하는게 아니라 클래스를 통해서 변수와 함수를 사용하는 방식
// static 변수, 함수
class A {
static age = 37;
static hello() {
console.log(A.age);
}
}
console.log(A, A.age);
A.hello();
class B {
age = 37;
static hello() {
console.log(this.age);
}
}
console.log(B, B.age);
B.hello();
//new B().hello();
class C {
static name = '이 클래스의 이름을 C 가 아니다.'
}
console.log(C);
결과
static name은 그 클래스의 이름을 뜻하기도 한다.
// 상속 기본
class Parent {
name = 'Lee';
hello() {
console.log('hello', this.name);
}
}
class Child extends Parent {
}
const p = new Parent();
const c = new Child();
console.log(p, c);
c.hello();
c.name = 'Anna';
c.hello();
결과
자식클래스는 부모클래스에서 상속받았기때문에 부모클래스에 있는 변수와 함수들을 그대로 가지고 있다.
// 변수, 함수 추가 및 오버라이딩
class Parent {
name = 'Lee';
hello() {
console.log('hello', this.name);
}
}
class Child extends Parent {
age = 37;
hello() {
console.log('hello', this.name, this.age);
}
}
const p = new Parent();
const c = new Child();
console.log(p, c);
c.hello();
c.name = 'Anna';
c.hello();
결과
// super
class Parent {
name;
constructor(name) {
this.name = name;
}
hello() {
console.log('hello', this.name);
}
}
class Child extends Parent {
age;
constructor(name, age){
super(name);
this.age = age;
}
hello() {
console.log('hello', this.name, this.age);
}
}
const p = new Parent('Mark');
const c = new Child('Mark', 27);
console.log(p,c);
c.hello();
결과
// static 상속
class Parent {
static age = 37;
}
class Child extends Parent {}
console.log(Parent.age, Child.age);
// 생성자 함수
function A() {}
const a = new A();
console.log(a, typeof a);
console.log(A());
결과
A()에 return값이 없어서 undefined라고 나온다.
// 생성자 함수
function A() {}
const a = new A();
console.log(a, typeof a);
console.log(A());
// 생성하면서 데이터 넣기
function B(name, age) {
console.log(name, age);
}
const b = new B();//객체 생성
const c = new B('Mark', 27);
console.log(B());
결과
// 값을 속성으로 넣기
function A() {
this.name = 'Mark';
}
const a = new A(); // {name : 'Mark'}
console.log(a);
// 함수를 속성으로 넣기
function B() {
this.hello = function() {
console.log('hello');
}
}
(new B()).hello();
// new Funcrion()
결과
// new Object
const a = new Object();
console.log(a, typeof a);
const b = new Object(true);
console.log(b, typeof b);
const c = new Object({name : 'Mark'});
console.log(c, typeof c);
// function
// 이름이 hello1 인 함수를 선언
function hello1() {
console.log('hello1');
}
console.log(hello1, typeof hello1);
함수도 객체의 한 종류라서 hello1함수를 호출하면 객체 형식으로 나옴
결과
// 함수의 매개변수
// 함수를 호출할 때 값을 지정
function hello2(name) {
console.log('hello2', name);
}
// 함수의 리턴
// 함수를 실행하면 얻어지는 값
function hello3(name) {
return `hello3 ${name}`;
}
console.log(hello3('Mark'));
hello3(name) 여기서 name은 매개변수인데 밑에서 hello3을 호출할때 name매개변수에 Mark를 넣어서 호출했으므로
결과
// function
// 이름이 hello1 인 함수를 선언
const hello1 = function() {
console.log('hello1');
};
console.log(hello1, typeof hello1);
결과
function hello1() {
console.log('hello1');
}
hello1();
결과
위치를 바꿔도 똑같다
hello1();
function hello1() {
console.log('hello1');
}
결과
// new Function(/* 인자1, 인자2, ....., 함수의 바디 */);
const sum = new Function('a', 'b', 'c', 'return a + b + c');
console.log(sum(1, 2, 3));
결과
sum선언전에 사용해서 에러가 뜸
// new Function(/* 인자1, 인자2, ....., 함수의 바디 */);
console.log(sum(1, 2, 3));
const sum = new Function('a', 'b', 'c', 'return a + b + c');
결과
{
const a = 1;
const test = new Function('return a');
console.log(test());
}
결과
a가 정의되지 않았다고 뜬다 여기서 사용 되는 a는 아래의 코드처럼 {}밖에서 전역변수로 지정해줘야 된다
// const sum = new Function('a', 'b', 'c', 'return a + b + c');
global.a = 0;
{
const a = 1;
const test = new Function('return a');
console.log(test());
}
결과
// const sum = new Function('a', 'b', 'c', 'return a + b + c');
global.a = 0;
{
const a = 1;
const test = new Function('return a');
console.log(test());
}
{
const a = 2;
const test = function() {
return a;
}
console.log(test());
}
두번째 {}안의 a는 const a = 2;를 인식해서 아래의 결과와 같이 나온다
결과
*arrow function (es6에서 생겨남, 항상 익명함수이다)
// arrow 함수를 만들어 이름이 hello1인 변수에 할당
const hello1 = () => {
console.log('hello1');
};
// 함수의 매개변수
// 함수를 호출할 때 값을 지정
// 매개변수가 하나일 때, 괄호 생략 가능
const hello2 = name => { // 원래는 (name)
console.log('hello2', name);
};
const hello3 = (name, age) => {
console.log('hello3', name, age);
};
// 함수의 리턴
// 함수를 실행하면 얻어지는 값
const hello4 = name => {
return `hello4 ${name}`;
}
const hello5 = name => `hello5 ${name}`;
// 생성자 함수를 이용하여 새로운 객체를 만들어 내는 방법
function Person(name, age) {
console.log(this);
this.name = name;
this.age = age;
}
const p = new Person('Mark', 37);
console.log(p, p.name, p.age);
const a = new Person('Anna', 26);
console.log(a, a.name, a.age);
const Cat = (name, age) => {
console.log(this);
this.name = name;
this.age = age;
}
const c = new Cat('냥이', 1);//불가 이유 : arrowfunction안에서는 this가 생겨나지 않아서 객체안에 프로퍼티를 못넣어준다.
결과
// 함수를 호출하면 함수를 만들어서 리턴
function plus(base) {
return function(num) {
return base + num;
}
}
const plus5 = plus(5);
console.log(plus5(10));
const plus7 = plus(7);
console.log(plus7(8));
결과
// 함수를 인자로 하여 함수를 호출
function hello(c) {
console.log('hello');
c();
}
hello(function() {
console.log('콜백');
});
// 초기화 하면서 선언된 변수를 중괄호 안 반복 블럭에서 사용할수 있다.
for (let i = 0; i < 5; i++) {
console.log('안녕하세요', i);
}
결과
for (let i = 0, j = 5; i<5; i++) {
console.log('안녕하세요', i, j);
}
결과
for (let i = 0, j =2; i < 5; i++, j = j * j) {
console.log('안녕하세요', i, j);
}
결과
// 반복문을 즉시 종료하고 싶을 때는 반복되는 블럭 안에서 break; 를 실행하면 가능하다.
for(let i = 0; i < 5; i++) {
console.log(i);
if(i > 2) {
break;
}
console.log('안녕하세요', i);
}
결과
// 반복되는 블럭 안에서 continue; 를 만나면 거기서 바로 해당 블럭은 종료합니다.
// 그리고 이와 같이 다음 반복이 있으면 다음 반복으로 넘어갑니다.
for(let i = 0; i < 5; i++) {
console.log(i);
if(i < 2) {
continue;
}
console.log('안녕하세요', i);
}
// 표현식 && 표현식
// 둘다 참 일때만 참이다.
// 표현식은 앞에 먼저 평가하고, 뒤에를 평가한다.
// 앞 표현식을 평가를 해서 참 일때만, 뒤표현식을 평가할 필요가 생기기 때문에 뒤의 표현식이 실행된다.
let n = 5;
(n % 5 === 0) && console.log('5로 나누어 떨어질때만 실행이 됩니다.') // && 앞에가 참일경우에 console.log('5로 나누어 떨어질때만 실행이 됩니다.') 이부분이 실행됨
결과
// 표현식 && 표현식
// 둘다 참 일때만 참이다.
// 표현식은 앞에 먼저 평가하고, 뒤에를 평가한다.
// 앞 표현식을 평가를 해서 참 일때만, 뒤표현식을 평가할 필요가 생기기 때문에 뒤의 표현식이 실행된다.
let n = 7;
(n % 5 === 0) && console.log('5로 나누어 떨어질때만 실행이 됩니다.') // && 앞에가 참일경우에 console.log('5로 나누어 떨어질때만 실행이 됩니다.') 이부분이 실행됨
n을 7로 바꾸면 && 앞부분부터 참이 아니므로 && 뒷부분도 실행이 되지 않는다.
결과
// 앞 표현식의 평가 결과가 거짓일때는 뒤 표현식을 평가할 필요가 없어서 실행하지 않는다.
n = 6;
(n % 5 === 0) && console.log('5로 나누어 떨어질때만 실행이 됩니다.');
결과
n = 5;
n % 5 === 0 || console.log('5로 나누어 떨어지지 않을때만 실행');
// 앞 표현식을 평가를 해서 거짓 일때만, 뒤 표현식을 평가할 필요가 생기기 때문에 뒤의 표현식이 실행된다.
n = 6;
n % 5 === 0 || console.log('5로 나누어 떨어지지 않을때만 실행');
결과
삼항 연산자를 이용한 조건부 실행
// 조건 ? 조건이 참이면 실행되는 표현식 : 조건이 거짓이면 실행되는 표현식
// 중괄호 {} 를 사용할 수 없는 문법이기 때문에 하나의 표현식만 가능합니다.
let n = 5;
console.log(n % 5 === 0 ? '5의 배수 입니다.' : '5의 배수가 아닙니다.');
// 표현식의 결과를 변수에 할당할 수 있습니다.
const message = n % 5 === 0 ? '5의 배수 입니다.' : '5의 배수가 아닙니다.';
console.log(message);
결과
switch를 이용한 조건문
// switch 뒤 괄호 안에 있는 값이 무엇인지 중괄호 안에 있는 코드들을 비교해서 실행합니다.
// 아중에 default: 뒤에 있는 문장은 항상 참이어서 실행되는 블럭 입니다.
// 문장이 한줄이라서 중괄호는 생략했습니다.
let n = 5;
switch (n) {
default:
console.log(n);
}
결과
// 다음은 n 이 5로 나누었을떄 나머지가 0 인경우에 실행되는 블럭을 추가한 것입니다.
// case '비교할 값' : 을 이용해서 맞으면 실행됩니다.
// case 0: 인경우와 default : 인 경우 두 블럭 모두 순서대로 실행이 됩니다.
let n = 5;
switch (n % 5) {
case 0:
console.log('5의 배수입니다.');
default:
console.log(n);
}
결과
// 만약에 해당 블럭이 실행된후 다음 블럭을 거치지 않고 switch 문을 나가고 싶다면,
// case 문 안에서 break; 를 실행합니다.
let n = 5;
switch (n % 5) {
case 0:
console.log('5의 배수입니다.');
break;
default:
console.log(n);
}
결과
let n = 6;
switch (n % 5) {
case 0:{
console.log('5의 배수입니다.');
break;
}
case 1:
case 2:
case 3:
case 4:
console.log('5의 배수가 아닙니다.');
default:
console.log(n);
}
n 이 6이라서 case 0일때 안걸리고 case 1,2,3,4와 default에 걸리게 된다.
