0. Your first JS Project
css와 JS에 아무리 코드를 작성해도 화면에는 코드 밖에 안뜸.
브라우저는 HTML을 열고, HTML을 CSS와 JS를 가져오는 역할을 함.
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Momentum</title>
</head>HTML에서 이렇게 link를 통해서 css 파일과 연결해주고 html 파일을 열면
이런 결과가 나옴.
<body>
<script src="app.js"></script>
</body>JS도 연결해준다면
이런 결과가 나옴
1. Basic Data Types
자바스크립트에서는 숫자를 다룰 수 있음
하지만 이런 text눈 자바스크립트에서 문자를 입력하는 방법이 아님.
이렇게 입력해야 함
이런 것도 가능
우리는 이걸 string이라고 부름
string: 처음부터 끝까지 문자로 이루어진 것.
2. Variables
콘솔에 접근하는 방법
자바스크립트에서 이렇게 작성했다면
console.log(5 + 2);
console.log(5 * 2);
console.log(5 / 2);콘솔에서는
이렇게 나옴
만약 위에 숫자 5를 6으로 바꿔야 한다면 세번의 코드 수정이 필요함
그래서 그 과정을 줄이기 위해서 variable을 사용함
가장 먼저 const를 사용함
const a = 5;
console.log(a + 2);
console.log(a * 2);
console.log(a / 2);
똑같은 결과가 나옴
문자도 변수에 넣을 수 있음
const a = 5;
const myName = "Jiwon"
console.log(a + 2);
console.log(a * 2);
console.log(a / 2);
console.log("hello " + myName)
3. Const and let
자바스크립트에서 variable을 만드는 방법이 두 가지 있음
하나는 const를 사용하는 것이고 하나는 let을 사용하는 것임.
let a = 5;
const myName = "Jiwon"
console.log(a + 2);
console.log(a * 2);
console.log(a / 2);
console.log("hello " + myName)let으로 바꾸어도 결과는 변함이 없음
const 와 let의 차이점은
1) const는 constant로 값이 바뀔 수 없다는 것(업데이트가 안됨).
2) let은 업데이트가 가능함. (let을 쓰지 않고 업데이트가 가능함)
let a = 5;
let myName = "Jiwon"
console.log(a + 2);
console.log(a * 2);
console.log(a / 2);
console.log("hello " + myName)
myName = "Park"
console.log("your new name is " + myName)
하지만 너무 많은 업데이트가 있어도 코드가 더러워질 수 있으니 기본적으로 const를 사용하고, 필요할 때만 let을 사용함.
자바스크립트 초기 버전에는 const와 let은 없었고 var만 있었음. (요즘은 절대 안씀, var을 쓰면 이후 업데이트가 될지 안될지 아예 모름)
