노마드코더 바닐라JS 로 크롬 앱 반들기 Day1

1.Introduction

Welcome~Online IDE

2. Welcome to Javascript

1) Your First JS Project

• 터미널로 자바스크립트 파일 만드는 법

      cd document > document 폴더로 가기
      mkdir momentum(=파일명) 모멘텀이라는 이름의 파일명을 가진 파일 생성
      code momentum(=파일명) 비쥬얼스튜디오코드로 오픈하기

• 자바스크립트나 CSS는 브라우저에서 바로 열리지 않음.

• HTML만 열리고 HTML에서 CSS와 JS를 가져오는 것임.

• HTML에 CSS 연결하기 - Head에 연결

  <link rel="css파일명" href="파일명.css">
  

• HTML에 JS 연결하기 - body 끝에 연결

  	    <script src = "app.js"></script>

2.1) Baisic Data Types

• number > integer(정수) float(소수)
• String > 문자열

2.2) Variables

• console.log();
• const 변수 = 5;
• const veryLongVariableName = "hanna" (보통 다음 단어를 대문자로 씀)

2.3) const and let

• const > 상수로 불변한 변수 (절대 바뀌지 않을 때 사용)
• let > 가변 변수
• 대부분은 const로 작성하고, 바뀔 여지가 있을때는 let을 사용해야함.
• var은 업데이트 이후에 거의(사실 never) 사용하지 않음.

2.4) Booleans

• True False
• null > nothing, '없음'을 알리기 위한 것, '비어있어요'
• undefine > 있긴 하지만 정의되어있지 않음,

2.5) Arrays

• arr = [];
• push pop shift unshift
• arr[index]

2.6) Objects

• {}
• const obj = {}; 안의 밸류를 수정해도 변수 obj를 수정한 것은 아님. 에러는 obj 전체를 바꾸려고 할 때 발생함. 안의 것은 수정 가능.

2.7~2.8) Functions part one

• function(){}
• 매개변수 / 인자
• function의 인자는 함수 밖에서 존지하지 않음. (지역변수)
• object안에도 function을 넣을 수 있음.

  const 객체 = {
      sayhello: function(){
      console.log("hello!"}
      }

2.11) Returns

• console.log 대신 return을 사용해서 데이터 값을 저장해서 받아오기

2.13) Conditionals

• prompt("How old are you")?
• prompt는 답변이 완료될 때까지 JS 를 중지시키고, 예쁘지도 않고 CSS사용도 불가함. 그래서 잘 안씀
• prompt 취소 > null
• typeof variable
• string > number 로 변환하는 함수 : parseInt

2.14) Conditionals part 2

• isNAN 함수 : 인자를 주면 그것이 number인지 아닌지 True, False로 분간해줌.
• if(){}

2.15) conditional part 3

• if / else if