21.06.15 ๐Ÿ‘จโ€๐Ÿ’ป JS

18951 ๋‹จ์–ด jsTILTIL

TIL - 21.06.15

  1. ๋ณ€์ˆ˜ (Variable)
  2. ์ž๋ฃŒํ˜• (Data type)
  3. ํ•จ์ˆ˜ (Function)
  4. ์กฐ๊ฑด๋ฌธ (Condition)

1. ๋ณ€์ˆ˜ (Variable)

๋ณ€์ˆ˜๋Š” ์–ด๋– ํ•œ ๋ฐ์ดํ„ฐ๋ฅผ ํ•œ ๊ฐ’์œผ๋กœ ์„ ์–ธํ•˜๋Š” ๊ฒƒ์œผ๋กœ ๋ฐ์ดํ„ฐ๋ฅผ ์ €์žฅํ•˜๋Š” ์šฉ๋„๋กœ ์‚ฌ์šฉํ•œ๋‹ค.

let sunghoon;
sunghoon = "developer";

์ƒ๊ธฐ ์ฝ”๋“œ๋Š” sunghoon ์ด๋ผ๋Š” ๋ณ€์ˆ˜๋ฅผ ์„ ์–ธ(Declaration)ํ•˜๊ณ  ์„ ์–ธํ•œ ๋ณ€์ˆ˜(Assignment)์— developer๋ผ๋Š” ๊ฐ’์„ ํ• ๋‹น(Assignment)ํ•œ๋‹ค๋Š” ๋œป์œผ๋กœ,


let sunghoon = "developer";

์ƒ๊ธฐ ์ฝ”๋“œ์™€ ๊ฐ™์ด ํ•œ์ค„๋กœ ์ž‘์„ฑ ๊ฐ€๋Šฅํ•˜๋‹ค.

let ์™€ ๋น„์Šทํ•œ ํ‚ค์›Œ๋“œ๋Š” var ์™€ const๊ฐ€ ์žˆ๋Š”๋ฐ
var์€ ์„ ์–ธํ–ˆ๋˜ ๋ณ€์ˆ˜๋ฅผ ๋‹ค์‹œ ๋‹ค๋ฅธ ๊ฐ’์œผ๋กœ ์„ ์–ธ ํ•  ์ˆ˜ ์žˆ์ง€๋งŒ, let๊ณผ const๋Š” ๋‹ค์‹œ ์„ ์–ธ ํ•  ์ˆ˜ ์—†์œผ๋ฉฐ(์—๋Ÿฌ ๋ฐœ์ƒ),
let์€ ๋ณ€์ˆ˜๋ฅผ ์žฌ์ง€์ • ํ•  ์ˆ˜ ์žˆ์ง€๋งŒ, const๋Š” ์ฒ˜์Œ ์„ ์–ธํ•œ ๊ฐ’์„ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์—†๋‹ค.

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ฅผ ๊ณต๋ถ€ํ•˜๋ฉด์„œ ๊ฐ€์žฅ ๋จผ์ € ์ดํ•ดํ•ด์•ผ ํ•  ๊ฒƒ์€ '=(equal)'์ด '๋Š”'์ด ์•„๋‹ˆ๊ณ  ๊ฐ’์„ ๋ถ€์—ฌํ•˜๋Š” ํ• ๋‹น ์—ฐ์‚ฌ์ž๋ผ๋Š” ๊ฒƒ ์ด๋‹ค.

์ƒ๊ธฐ sunghoon = "developer";๋ฅผ ์ฝ์„๋•Œ ์„ฑํ›ˆ์€ ๋””๋ฒจ๋กœํผ๋กœ ์ฝ๊ธฐ๋ณด๋‹จ ์„ฑํ›ˆ์— ๋””๋ฒจ๋กœํผ๋ฅผ ํ• ๋‹น์œผ๋กœ ์ฝ๋Š” ์—ฐ์Šต์ด ํ•„์š”ํ•  ๋“ฏ ์‹ถ๋‹ค.

๊ทธ๋ฆฌ๊ณ  ๋ณ€์ˆ˜๋ช…์„ ์ ์„๋•Œ ๋›ฐ์–ด์“ฐ๊ธฐ๋ฅผ ์“ฐ์ง€ ์•Š์œผ๋ฉฐ ๋›ฐ์–ด์“ฐ๊ธฐ ๋‹ค์Œ ๊ธ€์ž๋ฅผ ๋Œ€๋ฌธ์ž๋กœ ์ ๋Š”๋‹ค๋Š” ์•ฝ์†(camelCase)์ด ์žˆ๋‹ค.
ex) let currentWriter = 1;

๋งŒ์•ฝ ๋ณ€์ˆ˜๋ฅผ ์„ ์–ธํ•˜๊ณ  ๊ฐ’์„ ํ• ๋‹นํ•˜์ง€ ์•Š์œผ๋ฉด, undefined ๋ผ๋Š” ๊ฐ’์ด ํ• ๋‹น๋˜๋ฉฐ ์ด ๊ฐ’์€ ํ›„์ˆ ํ•  null๊ณผ ๋‹ค๋ฅธ ๊ฐ’์ด๋‹ค.

2. ์ž๋ฃŒํ˜• (Data type)

์ž๋ฃŒํ˜•์—” 7๊ฐ€์ง€๊ฐ€ ์žˆ์œผ๋ฉฐ

String - ๋ฌธ์ž์—ด - '',"" ์‚ฌ์ด์˜ ๊ฐ’

Number - ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ ํ•œ๊ณ„(-(2^53 โˆ’ 1) ์™€ 2^53 โˆ’ 1์‚ฌ์ด์˜ ๊ฐ’๋งŒ ํ‘œํ˜„ ๊ฐ€๋Šฅ)๋กœ Number๋Š” Bigint๋กœ ๋‚˜๋‰˜๋Š”๋ฐ ์ˆซ์ž ๋’ค์— n\์„ ๋ถ™ํžˆ๋ฉด Bigint๋กœ ์ธ์‹๋˜๋ฉฐ ์ˆซ์ž ํฌ๊ธฐ์˜ ํ•œ๊ณ„๊ฐ€ ์—†์–ด์ง„๋‹ค.

Boolean - ๋ถˆ๋ฆฌ์–ธ(๋ถˆ๋ฆฐ) - ์ฐธ, ๊ฑฐ์ง“์˜ ๊ฐ’ - ๋ฐ˜๋ณต๋ฌธ, ์กฐ๊ฑด๋ฌธ ๋“ฑ์—์„œ ์‚ฌ์šฉ.

undefined - ์ง€์ •๋˜์ง€ ์•Š์Œ, ๋ณ€์ˆ˜์— ํ• ๋‹นํ•˜์ง€ ์•Š์•˜์„๋•Œ ํ• ๋‹น๋จ.

null - ์ง€์ •๋˜์ง€ ์•Š์Œ, ๋นˆ ๊ฐ’์ด๋ผ๋Š” ๊ฒƒ์€ undefined์™€ ๊ฐ™์ง€๋งŒ, ๊ฐ’์„ ๋”ฐ๋กœ ํ• ๋‹นํ•ด์•ผํ•˜๋Š” ๊ฐ’์ด๋ฉฐ, ์ฃผ๋กœ ์–ด๋–ค ๋ณ€์ˆ˜๋ฅผ ์ดˆ๊ธฐํ™”ํ•˜๋Š” ์šฉ๋„๋กœ ์‚ฌ์šฉ.

Symbol - HTML์˜ ID ๋น„์Šทํ•œ ๊ฒƒ.

Object - ๊ฐ์ฒด, ์—ฌ๊ธฐ์— ํ•จ์ˆ˜๋„ ํฌํ•จ๋œ๋‹ค.

์—ฌ๊ธฐ์„œ (undefined === null) = false ์ด๋‹ค.

3. ํ•จ์ˆ˜ (Function)

ํ•จ์ˆ˜๋Š” ์‰ฝ๊ฒŒ ๋งํ•ด ์ง€์‹œ์‚ฌํ•ญ์˜ ๋ฌถ์Œ์ด๋‹ค.

ํ•จ์ˆ˜์˜ ๊ตฌ์„ฑ์€ ํฌ๊ฒŒ ์ž…๋ ฅ๊ณผ ์ถœ๋ ฅ์œผ๋กœ ๋‚˜๋‰œ๋‹ค.
์ž…๋ ฅ์˜ ์š”์†Œ์—” ๋งค๊ฐœ๋ณ€์ˆ˜(Parameter), ์ธ์ž(Argument)๊ฐ€ ์žˆ๊ณ ,
์ถœ๋ ฅ์˜ ์š”์†Œ์—” ๋ฐ˜ํ™˜(Return)์ด ์žˆ๋‹ค.


function funcName(๋งค๊ฐœ๋ณ€์ˆ˜1, ๋งค๊ฐœ๋ณ€์ˆ˜2){
    let sum = (๋งค๊ฐœ๋ณ€์ˆ˜1 + ๋งค๊ฐœ๋ณ€์ˆ˜2);
    //๋ฐ˜ํ™˜
    return sum
}
// 4, 5๊ฐ€ ์ธ์ž์ด๋‹ค.
funcName(4,5) // 9

๋งค๊ฐœ๋ณ€์ˆ˜๋Š” ์ฝ”๋“œ๋ธ”๋Ÿญ ๋‚ด์—์„œ ํ•จ์ˆ˜๋ฅผ ์ „๊ฐœํ• ๋•Œ ์‚ฌ์šฉํ•˜๊ณ 
์ธ์ž๋Š” ํ•จ์ˆ˜๋ฅผ ์ „๊ฐœ๋œ ํ•จ์ˆ˜์— ๋Œ€์ž…ํ•  ๊ฐ’์ด๋‹ค.

๋งŒ์•ฝ return์„ ์‚ฌ์šฉํ•˜์ง€ ์•Š์œผ๋ฉด ํ•ด๋‹น ํ•จ์ˆ˜๋Š” ์–ด๋–ค ์ธ์ž๋ฅผ ๋„ฃ๋”๋ผ๋„ undefined๋ฅผ ์ถœ๋ ฅํ•œ๋‹ค.


ํ•จ์ˆ˜์˜ ์„ ์–ธ ๋ฐฉ์‹์œผ๋กœ๋Š” ์„ธ๊ฐ€์ง€๊ฐ€ ์žˆ๋Š”๋ฐ

//ํ•จ์ˆ˜ ์„ ์–ธ์‹
function plus(num1, num2){
    let sum = num1 + num2;
    return sum;
}
//ํ•จ์ˆ˜ ํ‘œํ˜„์‹
let plus = function(num1, num2){
    let sum = sum1 + num2;
    return sum;
}
// ํ™”์‚ดํ‘œ ํ•จ์ˆ˜
let plus = (num1, num2) => {
    let sum = sum1 + sum2;
    return sum;
}
//ํ™”์‚ดํ‘œ ํ•จ์ˆ˜๋Š” ์ฝ”๋“œ๋ธ”๋ก ๋‚ด ์ˆ˜์‹์ด ํ•˜๋‚˜์ผ ๋•Œ ์ค‘๊ด„ํ˜ธ์™€ ๋ฆฌํ„ด์„ ์ƒ๋žตํ•  ์ˆ˜ ์žˆ๋‹ค.
let plus = (num1, num2) => (num1 + num2);

์ƒ๊ธฐ ์„ธ๊ฐ’์€ ์ƒ๊ธด ๊ฑด ๋‹ฌ๋ผ๋„ ํ•จ์ˆ˜๊ฐ€ ๋‹ด๊ณ  ์žˆ๋Š” ์ˆ˜์‹ ์ž์ฒด๋Š” ๋™์ผํ•˜๋‹ค.
์„ ์–ธ์‹๊ณผ ๋‹ค๋ฅธ ๋‘ ๋ฐฉ์‹๊ณผ ๊ฐ€์žฅ ํฐ ์ฐจ์ด๋Š” ์„ ์–ธ์‹์€ ํ˜ธ์ด์ŠคํŒ… ์‹คํ–‰์˜ ์œ ๋ฌด์ด๋‹ค.

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋Š” ์ฝ”๋“œ๋ฅผ ์‹คํ–‰ํ•  ๋•Œ ์ฒ˜์Œ๋ถ€ํ„ฐ ๋๊นŒ์ง€ ์ฝ์€ ๋‹ค์Œ ๋ฉ”๋ชจ๋ฆฌ์— ์ €์žฅํ•œ ๋‹ค์Œ์— ์ถœ๋ ฅ๋˜๋Š”๋ฐ, ์ด ๊ณผ์ •์—์„œ ๋ณ€์ˆ˜์™€ ํ•จ์ˆ˜ ์„ ์–ธ์€ ์–ด๋Š ์œ„์น˜์— ์žˆ๋˜์ง€ ๊ฐ€์žฅ ๋จผ์ € ์ด๋ฃจ์–ด์ง„๋‹ค๊ณ  ์ƒ๊ฐํ•˜๋ฉด ํŽธํ•˜๋‹ค.

function wannaBeInFuture(name){
    let futureJob = name + ' wanna be a developer.';
    return futureJob;
}
console.log(wannaBeInFuture('Sunghoon')); // Sunghoon wanna be a developer.


// ํ•จ์ˆ˜ ์„ ์–ธ์ด ํ•จ์ˆ˜ ํ˜ธ์ถœ ๋’ค์— ์žˆ์ง€๋งŒ ์ •์ƒ์ ์œผ๋กœ ์ถœ๋ ฅ๋œ๋‹ค.
console.log(wannaBeInFuture('Sunghoon')); // Sunghoon wanna be a developer.

function wannaBeInFuture(name){
    let futureJob = name + ' wanna be a developer.';
    return futureJob;
    }

ํ˜ธ์ด์ŠคํŒ… ๋•Œ๋ฌธ์— console.log์˜ ์œ„์น˜์™€ ๊ด€๊ณ„์—†์ด ์ถœ๋ ฅ์€ ๋™์ผํ•˜๋‹ค.

๋งŒ์•ฝ ํ›„์ˆ ํ–ˆ๋˜ ํ•จ์ˆ˜ ์ž๋ฆฌ์— ์„ ์–ธ์‹์ด ์•„๋‹ˆ๋ผ ํ‘œํ˜„์‹ ํ•จ์ˆ˜๊ฐ€ ์™”์—ˆ๋‹ค๋ฉด?

console.log(wannaBeInFuture('Sunghoon')); // Uncaught ReferenceError: wannaBeInFuture is not defined

let wannaBeInFuture = function(name){
    let futureJob = name + ' wanna be a developer.';
    return futureJob;
}

์—๋Ÿฌ๊ฐ€ ๋ฐœ์ƒํ•œ๋‹ค.

๊ทธ๋Ÿฌ๋‹ˆ ํ˜ธ์ด์ŠคํŒ…์˜ ํŠน์„ฑ์„ ์ƒ๊ฐํ•ด์„œ ์ฝ”๋“œ๊ฐ€ ๊ผฌ์ผ ์ˆ˜ ์žˆ์œผ๋‹ˆ ํ•จ์ˆ˜์„ ์–ธ์€ ๋˜๋„๋ก ์ƒ๋‹จ์—, ํ˜ธ์ถœ์€ ํ•จ์ˆ˜์‹ ํ•˜๋‹จ์— ์ ๋Š” ํŽธ์ด ์ข‹๋‹ค.

4. ์กฐ๊ฑด๋ฌธ (Condition)

์กฐ๊ฑด๋ฌธ์„ ์•Œ๊ธฐ์œ„ํ•ด์„  ์—ฐ์‚ฐ์ž๋ฅผ ์šฐ์„  ์•Œ์•„์•ผ ํ•˜๋Š”๋ฐ,
๊ทธ์ค‘ ๋น„๊ต ์—ฐ์‚ฐ์ž๋ผ๋Š” ๊ฒƒ์ด ์žˆ๋‹ค.
์—ฐ์‚ฐ์ž๊ฐ€ ์ œ๋ฒ• ๋งŽ๊ธฐ ๋•Œ๋ฌธ์— <(<=), >(>=), ===, !== ๊ธฐ๋ณธ์ ์œผ๋กœ ์ด ๋„ค๊ฐ€์ง€๋Š” ๋จธ๋ฆฌ์— ์‹ฌ์–ด๋‘๊ณ  ๋‚˜๋จธ์ง€๋Š” MDN์„ ๋“œ๋‚˜๋“ค๋ฉฐ ๋ˆˆ์— ์ตํžˆ๋Š” ํŽธ์ด ์ข‹์„ ๋“ฏ ํ•˜๋‹ค.

์ด ์—ฐ์‚ฐ์ž๋“ค์„ ์•Œ์•„์•ผํ•˜๋Š” ์ด์œ ๋Š” ์—ฐ์‚ฐ์ž๋“ค๋กœ ๋ถˆ๋ฆฌ์–ธํƒ€์ž…์˜ ๊ฐ’์„ ๋ฝ‘์•„๋‚ผ ์ˆ˜ ์žˆ๊ธฐ ๋•Œ๋ฌธ์ธ๋ฐ


let age = 19; //
// age ๊ฐ’์ด 19์ด๊ธฐ์— age < 19๋Š” ๊ฑฐ์ง“์ด๋ฏ€๋กœ else๋ฅผ ์‹คํ–‰ํ•œ๋‹ค.
if(age<19){
console.log('์•ˆ๋…•!')
} else {
console.log('์•ˆ๋…•ํ•˜์„ธ์š”!')
}

๊ฐ„๋‹จํ•œ ์˜ˆ์ด์ง€๋งŒ ์ด์ฒ˜๋Ÿผ ๊ฐ’์— ๋”ฐ๋ผ ๊ฒฐ๊ณผ๋ฌผ์ด ๋‹ค๋ฅด๊ฒŒ ์ถœ๋ ฅ๋˜๋„๋ก ํ•  ์ˆ˜ ์žˆ๋‹ค.

if(์กฐ๊ฑด1){ ์กฐ๊ฑด 1์ด ์ฐธ์ผ ๋•Œ ์‹คํ–‰.
} else if(์กฐ๊ฑด2) { ์กฐ๊ฑด1์ด ๊ฑฐ์ง“์ด๊ณ  ์กฐ๊ฑด2๊ฐ€ ์ฐธ์ผ ๋•Œ ์‹คํ–‰.
} else if(์กฐ๊ฑด3) { ์กฐ๊ฑด1, 2๊ฐ€ ๊ฑฐ์ง“์ด๊ณ  ์กฐ๊ฑด 3์ด ์ฐธ์ผ ๋•Œ ์‹คํ–‰.
} else { ์กฐ๊ฑด1, 2, 3 ๋ชจ๋‘ ๊ฑฐ์ง“์ผ ๋•Œ ์‹คํ–‰.
}

๋น„๊ต์—ฐ์‚ฐ์ž์˜ ๊ฒฝ์šฐ NaN(Not a Number)์™€ ๋น„๊ตํ•  ๊ฒฝ์šฐ ํ•ญ์ƒ false๋ฅผ ๋ฐ˜ํ™˜ํ•œ๋‹ค.

์—ฐ์‚ฐ์ž์˜ ์ข…๋ฅ˜์—” ๋…ผ๋ฆฌ ์—ฐ์‚ฐ์ž๋„ ์žˆ๋Š”๋ฐ,
&&, ||, ! ๋“ฑ์ด ๋ฐ”๋กœ ๊ทธ๊ฒƒ์ด๋‹ค.
๋…ผ๋ฆฌ ์—ฐ์‚ฐ์ž๋Š” ๋‹ค๋ฅธ ํฌ์ŠคํŠธ์— ๋‚ด์šฉ์„ ์กฐ๊ธˆ ๋” ์ถ”๊ฐ€ํ–ˆ์œผ๋‹ˆ ๊ทธ ์ชฝ์„ ๋ณด์ž.

&&๋Š” AND ์—ฐ์‚ฐ์ž๋กœ ์—ฐ์‚ฐ์ž ์–‘ ์ชฝ์˜ ๊ฐ’์ด ์ „๋ถ€ ์ฐธ์ด์–ด์•ผ ์ฐธ์„ ์ถœ๋ ฅํ•˜๋Š” ์—ฐ์‚ฐ์ž์ด๋‹ค.
ex) isFruit && isSweet -> ๊ณผ์ผ์ž„๊ณผ ๋™์‹œ์— ๋‹ฌ์•„์•ผ ์ฐธ.

||๋Š” OR ์—ฐ์‚ฐ์ž๋กœ ์—ฐ์‚ฐ์ž ์–‘ ์ชฝ์˜ ๊ฐ’์ค‘ ํ•˜๋‚˜๋งŒ ์ฐธ์ด์–ด๋„ ์ฐธ์„ ์ถœ๋ ฅํ•˜๋Š” ์—ฐ์‚ฐ์ž์ด๋‹ค.
ex) isFruit || isVegetable -> ๊ณผ์ผ์ด๊ฑฐ๋‚˜ ์ฑ„์†Œ๋ฉด ์ฐธ.

!๋Š” NOT ์—ฐ์‚ฐ์ž๋กœ ์ „์ˆ ํ•œ ๋‘ ์—ฐ์‚ฐ์ž์™€ ํ•จ๊ป˜ ์“ฐ๋Š” ์—ฐ์‚ฐ์ž์ธ๋ฐ, ๋‘ ์—ฐ์‚ฐ์ž ์–‘ ์ชฝ์˜ ๊ฐ’ ์•ž์— ๋ถ™์–ด ๋ถ€์ •์˜ ์˜๋ฏธ๋ฅผ ํฌํ•จ์‹œํ‚จ๋‹ค.
ex1) isFruit && !isSweet -> ๊ณผ์ผ์ด๋ฉด์„œ ๋‹ฌ์ง€ ์•Š์•„์•ผ ์ฐธ.
ex2) isFruit || !isVegetable -> ๊ณผ์ผ์ด๊ฑฐ๋‚˜ ์ฑ„์†Œ๊ฐ€ ์•„๋‹ˆ์–ด์•ผ ์ฐธ. ์ฐธ์™ธ๋Š”? ์ฐธ์™ธ๋กญ๋‹ค

์†Œ๊ฐœํ–ˆ๋˜ ๋น„๊ต ์—ฐ์‚ฐ์ž, ๋…ผ๋ฆฌ ์—ฐ์‚ฐ์ž ๋ง๊ณ ๋„ ์‚ฐ์ˆ  ์—ฐ์‚ฐ์ž, ๋ฌธ์ž์—ด ์—ฐ์‚ฐ์ž ๋“ฑ๋“ฑ ์ •๋ง ๋งŽ์€๋ฐ ์ „๋ถ€ ์™ธ์šฐ๊ธฐ ๋ณด๋‹ค๋Š” ์ด ์•„๋ฆ„๋‹ค์šด ์‚ฌ์ดํŠธ์— ์ž์ฃผ ๋ฐฉ๋ฌธํ•˜๋ฉด์„œ ๋ˆˆ์— ์ตํžˆ๋Š”๊ฒŒ ๋‚˜์„ ๋“ฏ ํ•˜๋‹ค.


๊ทธ๋Ÿฐ๋ฐ ์˜ค๋Š˜ ๊ณต๋ถ€ํ•˜๋ฉด์„œ ๋ˆˆ์— ๊ฑฐ์Šฌ๋ ธ๋˜ ์—ฐ์‚ฐ์ž ๋ช‡ ๊ฐ€์ง€๋งŒ ์ถ”๊ฐ€๋กœ ์ •๋ฆฌํ•˜์ž๋ฉด,

%๋Š” ๋‚˜๋จธ์ง€ ์—ฐ์‚ฐ์ž์ด๋‹ค. ์‚ฐ์ˆ  ์—ฐ์‚ฐ์ž ์ค‘ ํ•˜๋‚˜์ด๋ฉฐ ๋‚˜๋ˆ„๊ณ  ๋‚จ์€ ๊ฐ’์„ ์ถœ๋ ฅํ•œ๋‹ค.
ex) console.log(54 % 10) // 4

++๋Š” ์ฆ๊ฐ€ ์—ฐ์‚ฐ์ž์ด๋‹ค. ์—ญ์‹œ ์‚ฐ์ˆ  ์—ฐ์‚ฐ์ž ์ค‘ ํ•˜๋‚˜์ด๋ฉฐ, ๊ฒฐ๊ณผ์ ์œผ๋กœ ๊ฐ’์— 1์„ ๋”ํ•˜๋Š” ์—ญํ• ์„ ํ•œ๋‹ค.
๊ฐ’์„ ๋ฐ˜ํ™˜์‹œํ‚ฌ๋•Œ ์ˆซ์ž ์•ž์— ++๊ฐ€ ์˜ค๋Š๋ƒ ๋’ค์— ์˜ค๋Š๋ƒ์— ๋”ฐ๋ผ์„œ ์ถœ๋ ฅ์ด ๋‹ฌ๋ผ์ง€๋Š”๋ฐ, ์ „์œ„ํ˜•(++i)์ผ๋•Œ๋Š” 1 ๋”ํ•œ ๊ฐ’์„ ๋ฐ”๋กœ ๋‹ค์Œ ์ฝ”๋“œ๋ถ€ํ„ฐ ์‚ฌ์šฉํ•˜๊ณ , ํ›„์œ„ํ˜•(i++)์ผ๋•Œ๋Š” ๋ฐ˜ํ™˜๋˜๊ธฐ ์ „๊นŒ์ง€๋Š” ๊ธฐ์กด ๊ฐ’์œผ๋กœ ์‚ฌ์šฉํ•˜๋‹ค๊ฐ€ ๋‹ค์‹œ ๋Œ์•„๊ฐ€์„œ ์ฝ”๋“œํƒ€๊ณ  ๋‚ด๋ ค์˜ฌ๋•Œ 1 ๋”ํ•œ ๊ฐ’์œผ๋กœ ์‚ฌ์šฉํ•œ๋‹ค.

let i = 0;
while(i<10){
console.log(i);
i++;
}
// ์ด ๊ฒฝ์šฐ i๊ฐ€ 0~9๊นŒ์ง€ ์ถœ๋ ฅํ•˜๊ณ  ์ถœ๋ ฅ๋œ ์ตœ์ข… i ๊ฐ’์€ 9์ด๋‹ค.
// ์ฆ๊ฐ€ ์—ฐ์‚ฐ์ž๋กœ 10์ด ๋œ ๊ฒƒ์€ ๋งž์ง€๋งŒ, ํ›„์œ„ํ˜•์ด๋ฏ€๋กœ ๊ธฐ์กด ๊ฐ’์„ ์ถœ๋ ฅํ•˜๊ณ  ํ˜„์žฌ ๊ฐ’์€ ์ฝ”๋“œ ์œ„๋กœ ์˜ฌ๋ผ๊ฐ€์„œ ๋ชป ๋‚ด๋ ค์˜ค๊ธฐ ๋•Œ๋ฌธ.
let i = 0;
while(i<10){
console.log(i);
++i;
}
// ์ด ๊ฒฝ์šฐ i๋Š” 0~9๊นŒ์ง€ ์ถœ๋ ฅํ•˜๊ณ  ์ฝ˜์†” ์ƒ์˜ ์ตœ์ข… i ๊ฐ’์€ 10์ด๋‹ค.
// ์ถœ๋ ฅํ•˜๋Š” ๋‹จ๊ณ„๊ฐ€ ํ•ด๋‹น ์ฝ”๋“œ๋ฅผ ์ง€๋‚œ ๋‹ค์Œ ์ฝ”๋“œ๋ถ€ํ„ฐ i๋Š” 10์ด ๋˜์—ˆ๊ธฐ ๋•Œ๋ฌธ.

์ƒ๊ธฐ ๋‘๊ฐœ์˜ ๋ฐ˜๋ณต๋ฌธ์—์„œ ๋‘˜ ๋‹ค i = 10 ์ด๋‹ค.



?๋Š” ์‚ผํ•ญ ์—ฐ์‚ฐ์ž์ด๋‹ค. ์กฐ๊ฑด(์‚ผํ•ญ) ์—ฐ์‚ฐ์ž ์ค‘ ํ•˜๋‚˜์ด๋ฉฐ ์กฐ๊ฑด ? ๊ฐ’1 : ๊ฐ’2์—์„œ ์กฐ๊ฑด์ด ์ฐธ์ด๋ฉด ๊ฐ’1๋ฅผ ๊ฐ’์œผ๋กœ, ๊ฑฐ์ง“์ด๋ฉด ์กฐ๊ฑด2๋ฅผ ๊ฐ’์œผ๋กœ ๊ฐ€์ง„๋‹ค.
ex) let grade = (score >= 60) ? "pass" : "fail"; // ์ ์ˆ˜(score)๊ฐ€ 60์  ์ด์ƒ์ด๋ฉด pass๋ฅผ ๋“ฑ๊ธ‰์˜ ๊ฐ’์œผ๋กœ, 60์  ๋ฏธ๋งŒ์ด๋ฉด fail์„ ๋“ฑ๊ธ‰์˜ ๊ฐ’์œผ๋กœ ๊ฐ€์ง„๋‹ค.

ํ‘œํ˜„์‹์ด ์•„๋‹Œ ๋ฌธ๋ฒ• ๊ตฌ์กฐ(continue, break๋“ฑ)์—๋Š” ์‚ผํ•ญ ์—ฐ์‚ฐ์ž๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์—†๋‹ค.
๊ทธ๋ ‡๊ธฐ์— ์‚ผํ•ญ ์—ฐ์‚ฐ์ž๋ฅผ if๋ฌธ ๋Œ€์‹  ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์„ ์ง€์–‘ํ•˜๋Š”๊ฒŒ ์ข‹๋‹ค.

Truthy์™€ Falsy

Truthy๋Š” ์ฐธ ๊ฐ™์€ ๊ฐ’, Falsy๋Š” ๊ฑฐ์ง“ ๊ฐ™์€ ๊ฐ’์ด๋‹ค.
6๊ฐ€์ง€ ๊ธฐ์–ตํ•ด์•ผํ•  falsy ๊ฐ’์ด ์žˆ๋Š”๋ฐ,

false, null, undefined, 0, NaN, ''(๋นˆ String) ์ด ๊ทธ๊ฒƒ์ด๋‹ค.

falsy์˜ ๋ฐ˜๋Œ€ ๊ฐ’์€ true ๊ฐ’์ด๋ฉฐ truthy ์˜ ๋ฐ˜๋Œ€ ๊ฐ’๋„ false์ด๋‹ค.

(!falsy === true) = true, (!truthy === false) = true

GOOD ๐Ÿ˜‰

์˜ค๋Š˜ ์ฒ˜์Œ ํŽ˜์–ด๋ง ํ–ˆ์—ˆ๋Š”๋ฐ, ์ฒซ ํŽ˜์–ด ๋ถ„์ด ์ข‹์€ ๋ถ„์ด๋ผ ๊ธฐ๋ถ„์ด ์ข‹๋‹ค.
์˜ค๋Š˜ ๋ฐฐ์šด ๊ฒƒ์€ ๋‹ค ๋ณต์Šตํ–ˆ๋‹ค! ๋‚ด์ผ ์ผ์–ด๋‚˜๋ฉด ๊นŒ๋จน์„ ๋“ฏ

BAD ๐Ÿ˜ฅ

์ƒํ™œ์ฝ”๋”ฉ.JS ๋๋‚ด๋ ค๊ณ  ํ–ˆ๋Š”๋ฐ ํ•จ์ˆ˜ํŒŒ๋ฉด ํŒ”์ˆ˜๋ก ๋ญ๊ฐ€ ๋งŽ์ด ๋‚˜์™€์„œ ๊ฐ์ฒด๋Š” ๋„˜๋ณด์ง€๋„ ๋ชปํ–ˆ๋‹ค.
์ฝ”ํ”Œ๋ฆฟ ๋ฌธ์ œ์— ๋น„ํ•ด ํŽ˜์–ด๋ง ํ• ๋‹น์‹œ๊ฐ„์ด ๋„ˆ๋ฌด ๊ธธ์–ด์„œ ๋นจ๋ฆฌ ๋๋‚ด๊ณ  ์กฐ๊ธˆ ์žค๋‹ค. ์ปคํ”ผ๊ฐ€ ์•ˆ ๋“ค์–ด

TO DO ๐Ÿ”ฅ

๋‚ด์ผ ์•„์นจ ์กฐ๊ฑด๋ฌธ ๋‹ค์‹œ ํ•œ๋ฒˆ ๋ณต์Šต, ๋๋‚ด๊ณ  ๋ฌธ์ž์—ด ๊ณต๋ถ€ํ•˜๊ธฐ.

Retrospect ๐Ÿง

๋‹ค๋ฅธ ๋™๊ธฐ ๋ถ„๋“ค์€ ์‹œ๊ฐ„์ด ๋งŽ์ด ๋‚จ์•˜๋‹ค๊ณ  ํ•˜์…จ๋Š”๋ฐ ๋‚˜๋Š” ์ž๋ฃŒ ์ฐพ๊ณ  ์—ฌ๋Ÿฌ๊ฐœ ๋ณธ๋‹ค๊ณ  ์‹œ๊ฐ„์ด ์ข€ ๋ถ€์กฑํ–ˆ๋‹ค. ๋ฐฅ๋„ 15๋ถ„ ๋œ ๋จน์—ˆ์–ด
์ฝ”ํ”Œ๋ฆฟํ•˜๋Š”๋ฐ ์–ด๋ฆฌ๋ฒ„๋ฆฌ๊นŒ์„œ ์กฐ๊ธˆ ๋จธ์“ฑํ–ˆ๋‹ค.
ํ•จ์ˆ˜์—์„œ ๋ฆฌํ„ดํ•ด์•ผํ•˜๋Š”๋ฐ ์—‰๋šฑํ•œ ๊ฐ’์„ ์ž๊พธ ์ง‘์–ด๋„ฃ์–ด์„œ ํŽ˜์–ด๋‹˜์„ ๋‹นํ™ฉ์‹œ์ผฐ๋‹ค๐Ÿ˜‡
๋‚ด์ผ์€ ์–ด๋ฆฌ๋ฒ„๋ฆฌ๊นŒ์ง€๋ง๊ณ  ๋” ์ง‘์ค‘ํ•˜๊ณ  ๋” ์—ด์‹ฌํžˆ ๊ณต๋ถ€ํ•˜์ž.

๋ธ”๋กœ๊น…ํ•˜๋Š”๋ฐ ๋Œ€๋žต 2์‹œ๊ฐ„ 30๋ถ„..
์ง€๊ธˆ ๋ฐฐ์šด๊ฒŒ ๋ณ„๋กœ ์—†๋Š”๋ฐ๋„ ์ด ์ •๋„๋ฉด ์‹ฌํžˆ ๊ณค๋ž€ํ•ด์งˆ๋“ฏ ํ•˜๋‹ค ๐Ÿค”
๋ณต์Šตํ•˜๋Š”๊ฑด ์ข‹์ง€๋งŒ ์ด๋Ÿฐ ๋ฐฉ์‹์˜ ๋ธ”๋กœ๊น…์ด ๋งž๋Š” ๋ฐฉ์‹์ผ์ง€ ๊ณ ๋ฏผํ•ด๋ด์•ผ๊ฒ ๋‹ค.

Reference ๐Ÿ™‡

https://developer.mozilla.org/
https://ko.javascript.info/
https://poiemaweb.com/
https://opentutorials.org/
https://www.zerocho.com/

์„ ๋ฐฐ ๊ฐœ๋ฐœ์ž๋‹˜๋“ค ๊ทธ๋žœ์ ˆ ๋ฐ•์Šต๋‹ˆ๋‹ค

์ข‹์€ ์›นํŽ˜์ด์ง€ ์ฆ๊ฒจ์ฐพ๊ธฐ