[Javascript][Lecture][드림코딩]자바스크립트 기초 강의(ES5+)(4/13)

4. 코딩의 기본 operator, if, for loop 코드리뷰 팁 | 프론트엔드 개발자 입문편 (JavaScript ES6)

// 1. String concatenation
console.log("my" + " cat");
console.log("1" + 2);
console.log(`string literals: 1 + 2 = ${1 + 2}`);

// 2. Numeric operators
console.log(1 + 1); // add
console.log(1 - 1); // substract
console.log(1 / 1); // divide
console.log(1 * 1); // muliply
console.log(5 % 2); // remainder
console.log(2 ** 3); // exponentiation

// 3. Increment and decrement operators
let counter = 2;
const preIncrement = ++counter;
// counter = counter + 1;
// preIncrement = counter;
console.log(`preIncrement: ${preIncrement}, counter: ${counter}`);
const postIncrement = counter++;
// postIncrement = counter;
// counter = counter + 1;
console.log(`preIncrement: ${preIncrement}, counter: ${counter}`);
const preDecrement = --counter;
console.log(`preIncrement: ${preDecrement}, counter: ${counter}`);
const postDecrement = counter--;
console.log(`preIncrement: ${preDecrement}, counter: ${counter}`);

// 4. Assignment operators
let x = 3;
let y = 6;
x += y; // x = x + y;
x -= y;
x *= y;
x /= y;

// 5. Comparison operators
console.log(10 < 6); // less than
console.log(10 <= 6); // less than or equal
console.log(10 > 6); // greater than
console.log(10 >= 6); // greater than or equal

// 6. Logical operators: || (or), && (and), ! (not)
const value1 = false;
const value2 = 4 < 2;

// || (or), finds the first truthy value
console.log(`or: ${value1 || value2 || check()}`); // 심플한 코드를 먼저 실행하게끔 하자

// && (and), finds the first truthy value
console.log(`and: ${value1 && value2 && check()}`); // 심플한 코드를 먼저 실행하게끔 하자

// often used to compress long if-statment
// nullableObject && nullableObject.something
// if (nullableObject != null) {
//   nullableObject.something;
// }

function check() {
  for (let i = 0; i < 10; i++) {
    //wasting time
    console.log("🤩");
  }
  return true;
}

// ! (not)
console.log(!value1);

// 7. Equality
const stringFive = "5";
const numberFive = 5;

// == loose qeuality, with type conversion
console.log(stringFive == numberFive);
console.log(stringFive != numberFive);

// === strict qeuality, no type conversion
console.log(stringFive === numberFive);
console.log(stringFive !== numberFive);

// object equality by reference
const ellie1 = { name: "ellie" };
const ellie2 = { name: "ellie" };
const ellie3 = ellie1;
console.log(ellie1 == ellie2);
console.log(ellie1 === ellie2);
console.log(ellie1 === ellie3);

// equality - puzzler
console.log(0 == false); // true
console.log(0 === false); // false
console.log("" == false); // true
console.log("" === false); // false
console.log(null == undefined); //true
console.log(null === undefined); //false

// 8.  Conditional operators: if
// if, else if, else
const name = "Jongmin Choi";
if (name === "Jongmin Choi") {
  console.log("Welcome, Jongmin Choi!");
} else if (name === " coder") {
  console.log("You are amazing coder");
} else {
  console.log("unknown");
}

// 9. Ternary operator: ?
// condition ? value1 : value2
console.log(name === "Jongmin Choi" ? "yes" : "no"); // 간단히 쓸때만 쓰자

// 10. Switch statement
// use for multiple if checks
// use for enum-like value check
// use for multiple type checks in TS
const browser = "chrome";
switch (browser) {
  case "IE":
    console.log("go away!");
    break;
  case "chrome":
  case "Firefox": // 결과값이 같으면 같이 묶는다.
    console.log("love you!");
    break;
  default:
    console.log("same all!");
    break;
}

// 11. Loops
// while loop, while the condition is trythy,
// body code is executed.
let i = 3;
while (i > 0) {
  //   let j = [];
  console.log(`while: ${i}`);
  //   j.push(i);
  i--;
  //   console.log(j);
}

// do while loop, body code is executed first,
// then check the condition.
do {
  console.log(`dowhile: ${i}`);
  i--;
} while (i > 0);

// for loop, for(begin; condition; step)
for (i = 3; i > 0; i--) {
  console.log(`for: ${i}`);
}

for (let i = 3; i > 0; i = i - 2) {
  // inline variable declaration
  console.log(`inline variable for: ${i}`);
}

// nested loops (cpu에 부담이 간다 좋지 않다.)
for (let i = 0; i < 10; i++) {
  for (let j = 0; j < 10; j++) {
    console.log(`i: ${i}, j: ${j}`);
  }
}

// break, continue
// Q1. iterate from 0 to 10 and print only even numbers (use continue)
let evenNumbers = [];

for (let i = 1; i < 11; i++) {
  if (i % 2 === 1) {
    continue;
  }
  evenNumbers.push(i);
}

console.log(evenNumbers);

// Q2. iterate from 0 to 10 and print numbers until reaching 8 (use break)

let nums = [];

for (let i = 0; i < 11; i++) {
  if (i > 8) {
    break;
  }
  nums.push(i);
}

console.log(nums);