211130 프론트엔드 스쿨 22일차

JIAH·2021년 11월 30일
TIL
4

멋사 프론트엔드 스쿨 1기

목록 보기
22/30

수업내용 (이호준 강사님)


외워둘 것 자주 쓰임

let result = 0;
for (let value of array) {
    result += value;
}
console.log(result/array.length);

while로 1부터 100까지 짝수만 더해보세요.

let num = 0;

do {
  console.log(num);
  num += 1;
} while (num < 11);
let i = 1;
let sum = 0;

while (i <= 100) {
    if (i % 2 == 0) {
        sum += i;
    }
    i++;
}

console.log(sum);

구구단 while문으로 변경하기

for (var i = 2; i < 10; i++) {
  for (var j = 1; j < 10; j++) {
    document.write(`${i} X ${j} = ${i*j} <br>`);
  }
}

let i = 2;
let j = 1;
while (i < 10) {
  while (j < 10) {
    document.write(`${i} X ${j} = ${i*j} <br>`);
    j++;
  }
  j = 1; // 초기화가 필요하다
  i++;
}

while 구구단 5단까지 출력

let i = 2;
let j = 1;
while (i < 10) {
  if (i == 6){
    break;
  }
  while (j < 10) {
    console.log(`${i} X ${j} = ${i*j}`);
    j++;
  }
  i++;
  j = 1;
}

while 구구단 X 5까지 출력

let i = 2;
let j = 1;
while (i < 10) {
  while (j < 10) {
    console.log(`${i} X ${j} = ${i*j}`);
    if (j == 5){
        break;
    }
    j++;
  }
  i++;
  j = 1;
}

구구단 부연설명



강사님이 정리해주신 내용

변수(타입)

  • Array(배열)

    • 형태 : ['하나', '둘', '셋'], [100, 200, 300],
    • 호출 : 변수명, 변수명[0], 변수명[0][0] (변수명[index])

  • String(문자열)

    • 형태 : 'abcde', "abcde", abcde
    • 호출 : 변수명, 변수명0

  • Number(숫자)

    • 형태 : 10, 10.123
    • 호출 : 변수명

  • Boolean(논리값)

    • 형태 : true, false
    • 호출 : 변수명

  • Object(객체)

    • 형태 : {
      "지역이름": "전국",
      "확진자수": 24889,
      "격리해제수": 23030,
      "사망자수": 438,
      "십만명당발생율": 48.0
      }
    • 호출 : 변수명, 변수명.지역이름, 변수명['지역이름'] (변수명.key, 변수명[key])

  • undefine : undefind

  • null : object

  • NaN : number

산술연산(+, -, /, *, **, %)

논리연산(!, &&, ||)

비교연산(==, !=, >, >=, <, <=, ===, !==)

조건문(if, else if, else, switch)

반복문(for, for in, for of, while, do while, forEach, break, continue)

for (let i = 0; i < 10; i++) {
    console.log(i)
}

let a = [10, 20, 30, 40];
for (let i of a) {
    console.log(i);
}

let a = [10, 20, 30, 40];
for (let i in a) {
    console.log(i);
}

let x = 0;
while (x < 10) {
    console.log(x);
    x++;
}

let x = 0;
do {
    console.log(x);
    x++;
} while (x < 10)

let a = [10, 20, 30, 40];
a.forEach(e => console.log(e2));

for (let i = 0; i < 10; i++) {
    if (i == 5) {
        break;
    }
}

for (let i = 0; i < 10; i++) {
    if (i == 5) break;
    console.log(i);
}

for (let i = 0; i < 10; i++) {
    if (i == 5) break;
    console.log(i);
}

for (let i = 0; i < 10; i++) {
    if (i == 5) continue;
    console.log(i);
}

함수

  • 함수
    // 여기서 x, y를 보통 한국에서는 인자
    // 전달인자(아규먼트, argument) : 3, 5
    // 매개변수(파라미터, parameter) : x, y
function add(x, y){
    return x + y;
}

add(3, 5)

- 콜백함수
function add(x, y) {
    return x + y;
}

function mul(x, y) {
    return x * y;
}

function cal(a, b){
    return a(10, 10) + b(10, 10);
}

cal(add, mul);
- 화살표함수
function add(x, y) {
    return x + y
}

let addArrow = (x, y) => x + y;
- 익명함수 아님
// 기명 함수
let aa = function sum(x, y) {
    return x + y
}

// 익명 함수인것 같지만 바뀜
let bb = function(x, y) {
    return x + y
}
// ES5에서는 빈 문자열이었는데 ES6에서 name 값을 가지는 것으로 바뀌었습니다.
let cc = (x, y) => x + y;

선언

let x : 변수로 사용하세요.
var x (전역에서 사용할 변수값, 실무에서 되도록 사용X)
const x (변하지 않는 상수값)

전개표현식 사용

function add(...x){
    return x;
}

add(1, 2, 3, 4, 5)

블록스코프

hojun이 not defined 되었다고 나옵니다.

if (true){
    let hojun = 100;
}

console.log(hojun);
// 리터럴

정규표현식

prompt('hello?')
'hi'
comfirm()
VM188:1 Uncaught ReferenceError: comfirm is not defined
    at <anonymous>:1:1
(익명) @ VM188:1
confirm('hi')
true
alert('hello')
undefined

오늘의 TIP

새로 알게 된 내용

  • 솔직히 자바스크립트의 작동 원리나 논리적 구조에 대해 깊이 생각해본 적 없다. 내 코드가 잘 작동되는지 안되는지만 관심이 있었는데 동기들의 예리하고 깊숙한 질문 덕에 새로운 시각을 배웠다. 그런 의미에서 모던 자바스크립트 딥다이브 교재가 참 좋은 것 같다. 대충 알고 있는 자바스크립트 지식을 깔끔하고 논리적으로 정리해준다. 앞으로 딥다 스터디도 하기로 했으니까 집중해보자 아좌좌.
profile
JIAH
일단 해버리는 사람 되기~~
이전 포스트

211129 프론트엔드 스쿨 21일차

다음 포스트

211201 프론트엔드 스쿨 23일차

2개의 댓글

comment-user-thumbnail
dana
2021년 12월 2일

아좌좌~~

1개의 답글