본문 바로가기

Front-End/JavaScript

[JavaScript] 230323 학습일기

https://nomadcoders.co/javascript-for-beginners

 

바닐라 JS로 크롬 앱 만들기 – 노마드 코더 Nomad Coders

Javascript for Beginners

nomadcoders.co

노마드 코더 <바닐라 JS로 크롬 앱 만들기>로 학습한 내용을 정리하였다.


1.

자바스크립트에서는 string을 써줄 때

큰 따옴표, 작은 따옴표 모두 가능하다.

"hi"

'hi'

 

 

2.

app.js에 이렇게 써줬다.

console.log("이건 콘솔에 나타날 거야.");

 

그리고 나서 아래의 app.js를 연결시킨 index.html를 실행하면

<!DOCTYPE html>
<html lang="en">
<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">
    <title>Momentum</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <script src="app.js"></script>
</body>
</html>

이렇게 콘솔에 뜬다.

 

console.log(출력할 내용);

 

를 하면 괄호 안에 있는 것들이 콘솔창에 출력된다.

 

 

3. 변수 만들기

(1) const

const는 constant의 약자로 바뀌지 않는 값. 계속 유지됨.

const a =5;
const b =2;
const myName = "tina";

console.log(a+b);
console.log(a*b);
console.log(a/b);
console.log("hello "+ myName);

 

const 변수;

 

하면 변수를 선언할 수 있다

 

 

(2) let

const 대신 let을 써서 변수를 만들 수도 있다.

let a =5;
let b =2;
let myName = "tina";

console.log(a+b);
console.log(a*b);
console.log(a/b);
console.log("hello "+ myName);

 

*let과 const의 차이

 

const는 값이 바뀔 수 없음. 따라서 const로 생성된 변수는 값을 업데이트할 수 없음.

따라서 나중에라도 variable의 값을 업데이트할 가능성이 있는 경우 const 대신 let으로 변수를 생성해줘야 함.

 

let으로 생성된 변수는 값을 업데이트할 수 있음.

const a =5;
const b =2;
let myName = "tina";

myName = "tinalee";

console.log(a+b);
console.log(a*b);
console.log(a/b);
console.log("hello "+ myName);

 

 

 

5. 자바스크립트 변수 명명 관례

 

변수명으로 여러개의 단어를 붙일 때 맨 앞글자를 대문자로 해준다.

camelCase

 

veryLongVariableName

 

tinasNum

 

뭐 이렇게 말이다.

 

 

*별개로 파이썬 명명방식은 snake_case

 

very_long_variable_name

 

tinas_num

 

 

관례일 뿐 이렇게 안 한다고 해서 에러가 나지는 않는다.

 

 

6.

많은 사람들이 const를 기본적으로 사용하고

variable을 업데이트하고 싶다면 그때 let을 사용함.

 

모든 변수를 업데이트해야 하는 경우는 잘 없음.

프로그램에서 몇몇 중요한 부분만 업데이트하게 될 것.

 

대부분의(기본적인, default) 경우에 const를 사용하고

때에 따라 let을 사용해 변수를 생성하자.

 

 

7.

오래전 자바스크립트에는 const와 let대신 var을 사용해 변수를 생성했음.

지금도 몇몇 사이트에는 var이 사용됨. 브라우저도 var을 이해하고 있음.

 

var은 원한다면 어디서든 변수의 값을 업데이트할 수 있음.

var의 문제점은 var을 사용하면 우리는 언어를 통해 보호받지 못함.

var로 생성된 변수 a가 있다고 가정하자.

만약 내가 실수로 변수 a의 값을 업데이트해도, 언어가 말해주지 않음.

 

따라서 우리는 const와 let을 써서 변수를 생성한다.

이들을 통해서 우리는 몇몇 값을 보호할 수 있음.

var의 사용은 지양할 것.

 

 

8. 

null은 '아무것도 없음'을 의미함.

null은 그 변수에 아무것도 없다는 걸 뜻함.

 

null은 boolean type의 false와 다름.

false는 false라는 값이 있는 것.

그러나 null은 여기 아무것도 없다는 것을 의미함.

 

 

9. undefined

컴퓨터 메모리 안에는 존재함.

공간은 있는데 값이 들어가지 않음.

let something;
console.log(something);

 

 

 

 

 

 

 

 

 

 

'Front-End > JavaScript' 카테고리의 다른 글

[JavaScript] Todo-List 만들기(1)  (0) 2023.03.30
[JavaScript] 230327 학습일기  (0) 2023.03.29
[JavaScript] 230326 학습일기  (0) 2023.03.27
[JavaScript] 230324 학습일기  (1) 2023.03.25
[JavaScript] 230322 학습일기  (0) 2023.03.23