👩‍💻TIL3. Vanilla JS : 변수, 데이터 정렬

아래 글은 노마드코더 '바닐라 JS로 크롬 앱 만들기'를 수강하며 배운 점을 정리한 글입니다.
자바스크립트의 기본 문법과 변수, 데이터 정렬을 학습했다.

기본 문법

• Java Script의 각각의 코드는 하나의 expression(line)에 작성되어야한다.
• 모든 코드의 끝은 ;(세미콜론)으로 끝낸다.(instruction제외)
• 주석처리 방법 : //(한 줄 일때), /*(여러 줄일 때)

/* this is comment
this is comment
this is comment */

변수 선언 방식

1. let : 재선언 금지, 재할당 가능
2. var : 재선언 가능, 재할당 가능
3. const : 재선언 금지, 재할당 금지

변수를 선언하는 3가지 방법이 있고, 방법에 따라 재선언, 재할당 가능여부가 달라진다.

1. let : 재선언 금지, 재할당 가능

let a = 100;
a = 200;
console.log(a);

출력 > 200

2. var : 재선언 가능, 재할당 가능

var a = 100;
var a= 200;
console.log(a);

출력 > 200

3. const(constant) : 재선언 금지, 재할당 금지

const a = 100;
console.log(a);

출력 > 100

let, var와 달리 초기에 선언한 변수를 업데이트 할 수 없다.

변수에 넣을 수 있는 data 종류

1. string

const what = "yeji";

보통 string은 텍스트이다. " "(큰따옴표)안에 작성한다. 숫자를 넣어도 텍스트로 인식한다.

2. Boolean

const wat = false;

Boolean은 TRUE/FALSE값 만 갖는다.

3. 숫자

4. Float

const what = 33.333;

숫자인데 떠돌이 소수점을 가진 수를 말한다

변수 작성 방법 : Camel Case🐫

미래의 나에게 미움 받지 않으려면 변수는 이렇게 작성하자! 변수에 띄어쓰기를 할 수 없기 때문에 대문자로 대체해서 작성하는 방법이다. 처음은 소문자로 시작하고, 띄어쓰기 다음 알파벳만 대문자로 작성한다. ex) daysOfWeek

데이터 정렬 방법

1. array

const Snack = ["Crownsando","Magarette","Diget"];

[ ] 안에 쉼표로 구분해 작성해준다. 리스트와 같이 단순 나열된다.

2. object

const crownsando = {flavor:"strawberry",price:2000,isdelicious:true,color:"pink"
}

array와 다른 점은 각 data에 label을 부여할 수 있다는 점이다. { }(컬리 브라켓)안에 데이터를 작성한다. 데이터가 많고, 그 중 내가 원하는 정보만 찾고 싶을 때 사용하면 효율적일 수 있겠다.

object안에 array를 작성하는 것도 가능하다! 그리고 컴퓨터는 0부터 숫자를 센다.