JavaScript 기초

최송희·2021년 4월 4일

목록 보기

4/4

ECMAScript 란?! ES?

ECMAScript 자바 스크립트의 표준 규격을 뜻한다. ES 는 ECMAScipt 의 약자이다.
이중 ES6 에 가장 큰 관심이 있는 이유는 ES6에서 기존에 문제있던 부분들이 많이 해결되었고, React 나 Vue 등 유명 라이브러리들도 이에 맞춰서 변경되어서이다. (2015년 이후로 매년 6월에 규칙적으로 개정된다)

Vanilla JS란?

순수 자바스크립트 그 자체이다! Vanilla: ‘평범한, 특별할 것이 없는( ordinary )’
모든 브라우저는 결국 vanilla JS 로 이루어져 있고, 자주 사용하는 Jquery, React 등은 결국 Vanilla JS를 쉽게 사용할수 있도록 변형해준 프레임워크이다.

Javascript 추가 하는 방법

무조건 <body></body> 안에 넣어야 한다!
단 마지막줄에 넣어주자. 속도를 위해서~

<body>
	<script src="index.js"></script>
</body>

변수타입 const, let, var

const, let 은 ES6 의 문법이고, var는 이전의 문법이다.
const는 재정의할수 없는 상수값! let 변수는 계속 재선언할수있다.
let을 var로 변경해도 무리없이 실행된다

Array, Object

array 선언

const dayOfweek = ['mon','tue','wed','thur','fri','sat','sun'];
console.log(dayOfweek[0])

Object 선언 한뒤 array 안에 넣어서 사용하기

const abc = [{
    name : "test",
    age : 22,
    school : "high"
},{
    name : "Song",
    age : 34,
    food : {
        name : "kimchi",
        price : 5200
    }
}]

console.log(abc[1].food.name);

DOM이란?

문서 객체 모델(The Document Object Model, 이하 DOM) 은 HTML, XML 문서의 프로그래밍 interface 이다
javascript 는 브라우저 html에 있는 모든 요소를 가지고 와서 object로 변환한다

웹 페이지는 일종의 문서(document)다. 이 문서는 웹 브라우저를 통해 그 내용이 해석되어 웹 브라우저 화면에 나타나거나 HTML 소스 자체로 나타나기도 한다.
const title = document.getElementById("title");

tip?!

console.dir 하면 element 정보를 얻을수 있다!

console.dir(title)

최송희

이전 포스트