색션 0

HTML 과 CSS

JavaScript 소개 및 자료형

• 정식 이름은 ECMAScript
• 동적인 데이터들을 다룰 때 사용된다.
• Script Language 는 런타임때 코드의 해석이 실행된다는 특징이 있다.
• 현재의 표준버전 ES6(ECMASCirpt 2015, ES2015)

JavaScript 의 문법 - 이미 배운 내용이기에 다 기록하진 않고, 까먹었던 부분들 위주로 정리한다.

자료형(Data Type)

• Dynamic Typing : 동적 타이핑이라고도 부르며, 코드가 실행되고 데이터가 담길 때 그 타입이 결정되는 방식의 언어들을 말한다.
• Number, String, Boolean, Null, Undefined, Array, Object Type이 존재한다.
• Array 타입은 다양한 타입의 데이터를 넣고 구성할 수 있고, 다양한 자료형을 하나의 배열에 함께 사용도 가능하다.

  let arr4 = [true, 1, undefined, false, "h", 2, null, 'j']  

• Object 타입은 기본적으로 객체라고 하지만, JavaScript 에서는 키와 값으로 이루어진 쌍의 형태를 말하는 것이므로 전통적인 객체지향에서의 객체와는 그 의미가 다르다.

  let obj1 = { a: "apple", b:"banana", c:"carrot"};  
  let obj2 = { a: 1, b: 2, c: 3};  
  let obj3 = { a:"hello world", b: 100, c: [1, 2, 3,4]};  
  let obj4 = {        a: {a1: 1, a2: 2},  
      b: {b1: 3, b2: 4},  
      c: {c1: 5, c2: 15}  
  }  
  console.log(obj['a']);  
  console.log(obj2.a);  
  console.log(obj3['c']);  
  console.log(obj4.c.c2);  

JavaScript의 연산자

• 대입 연산자
• 산술 연산자
• 증감 연산자
• 비교 연산자
• 동등 연산자 - 일치 연산자(strict equality operators)
  • a === b / a !== b : 타입까지 엄격하게 비교하는 연산자이다.
• 이진 논리 연산자(Binary Logical Operators)
  • a && b
  • a || b

JavaScript의 함수

함수 선언 방식

• function statement 를 사용하는 방법 - arrow function expression 을 사용하는 방법

  // function statement function sum(a + b) {  
      return a + b;  
  }  
  console.log(sum(10, 20));  
  // 출력 : 30  
  // arrow function expression const multiply = (a, b) => {    return a * b;}  
  console.log(multiply(10, 20))  
  // 출력 : 200 

(실습) 개발환경 설정하기

• Node.Js(JavaScript runtime) 설치하기
• npm(node package manageer) Node와 함께 자동으로 설치됨
• 사용하기 편리한 IDE 설치하기(VSCode, webstorm 등등… )