멋사 프론트엔드 스쿨 1기 - 22일차

25187 단어 개발자프론트엔드멋쟁이사자처럼프론트엔드스쿨1기개발자

오늘은 반복문에 대해서 배웠는데.. 역시나 어려웠다.
구구단이 나오는 반복문 정답을 알려주셨는데도 이해가 안 돼서, 멘붕 그 자체였고 멘토님께 SOS를 쳤다. 다행인지 호준강사님께서 강의 진도 빼는 것을 잠깐 멈추고 하나씩 천천히 대입하면서 설명을 해주셨고, 많은 분들의 도움으로 이해를 할 수 있었다.

솔직히 강의를 듣다보면 나만 이해 못하나? 라는 생각이 들어서 질문 하기가 꺼려졌는데 질문을 하고 알고 넘어가는 것이 좋다고 말씀해주셔서 조금 용기가 생겼다. (감동 받아서 눈물 날뻔..ㅜㅜ 사실 눈물 맺혔음..ㅋㅋㅋㅋㅋ)

그리고, 나와 같은 개발 초보를 위해 배웠던 내용을 같이 개념 정리하는 시간을 수업시간에 가졌는데 정말 도움이 되었다. 그리고 어제 딥다이브 공부를 하면서 정리했던 내용과 겹치는 부분도 있어서 조금 더 이해가 잘 되었다.

기초적인 부분이지만 그동안 베이스로 깔고 수업이 진행되었던 부분을 정리하면서 알려주셨고, 마지막 한시간 정도 스스로 공부한 내용을 첨부하여 마크다운으로 정리해보는 시간을 가졌는데 도움이 많이 되었다고 생각한다.

앞으로 이런 시간이 자주 있었으면 좋겠다. 그동안은 진도 따라가기 바빠서 이해가 되지 않아도 다음 것을 배우고 있는 듯한 느낌이었다..

여튼, 오늘 마크다운으로 정리한 내용은 아래와 같다.

변수(타입, typeof로 확인 가능)

  • 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(e**2));
//예제
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;

  • 익명 함수

    console.dir(function (x, y) {return x + y;})

선언

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

전개표현식 사용

  • 전개구문 사용 예제

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

add(1, 2, 3, 4, 5)
    // 모던자바스크립트 예제(https://ko.javascript.info/rest-parameters-spread)
let arr1 = [1, -2, 3, 4];
let arr2 = [8, 3, -8, 1];
Math.max(1, ...arr1, 2, ...arr2, 25); // 25
    // 모던자바스크립트 예제(https://ko.javascript.info/rest-parameters-spread)
let arr = [3, 5, 1];
let arr2 = [8, 9, 15];

let merged = [0, ...arr, 2, ...arr2];

블록스코프

정규표현식

리터럴

  • 리터럴은 코드에 보여지는 타입의 표현을 의미
  • 예를 들어 원래 배열을 생성하려면
    new Array(4,5,6); 이렇게 해야하지만 [4,5,6] 이렇게 만들수도 있는데요. 이렇게 배열을 의미하는 코드( [4,5,6] )를 배열의 리터럴 표현이라고 합니다.
  • 마찬가지로 new Object() 의 리터럴 표현이 {}, new Number(5) 의 리터럴 표현이 5, new String("hello") 의 리터럴 표현이 "hello" 입니다.

사용자와 상호작용

  • prompt('hello')
  • comfirm('hello')
  • alert('hello')

★ 긍정의 한줄

말만 하고 행동하지 않는 사람은 잡초로 가득 찬 정원과 같다. - 하우얼 -

jsp 37) schedule map jsp
2013 장사 인터넷 경기 J 문제 캔디 스 (차분 구속 또는 수학 법칙) \ # by zh

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage