[JS/노마드코더] 바닐라 JS로 크롬 앱 만들기(2) - 자바스크립트 사용해보기

자바스크립트 기초

본 포스팅은 제가 공부한 걸 기록하고 기억하기위해 작성하는 것이기때문에 이미 알고있거나 간단한 내용은 제외하고 강의 내용을 정리했습니다.

[Tip] 자동완성 👀

index.html 초기코드 : !
css파일 첨부 : link:css
type을 알고싶을 때: typeof 변수
parseInt("this is string") => NaN반환, isNaN(parseInt("this is string"))으로 숫자인지아닌지 확인할 수 있다.

✔Basic Data Types

✔Variables

✔const & let

• const : 선언 후 값이 절대 바뀌지않는 변수
• let : 값을 바꿀수 있는 변수

  ※ var : 자바스크립트 초기에 사용되었음. 값을 바꿀수있음. 하지만 변경되면 안될 값들도 자유롭게 변경되며, 그런 상황이 발생했을 때 경고를 해주는 기능이 없었기에 그 문제를 해결하기위해 이후 const와 let이 패치로 추가됨.

✔Booleans

• const a = null; < null : 값이 없음을 의도적으로 표현
• const b; < undefined : 메모리에 만들어졌으나 값은 없음

✔Arrays

const xxx = [a, b, c];
xxx.push(d); // 배열 끝에 d 추가하기

✔Objects

const player = {
	name: "nico",
    points: 10
};
// 가져오기
console.log(player.name)
console.log(player["name"])

// 업데이트하기
player.points = 15;
// 추가하기
player.lastName = "potato";

※ const로 선언했지만 player 전체를 바꾸는 것이 아니라면 그 내부에 있는 값을 바꾸는 것은 가능합니다.

✔Functions

// 함수 정의
function plus(a, b) {
	console.log(a + b);
}
// 함수 실행
plus();

// 객체 내부에 함수 정의
const player = {
	name: "nico",
    sayHello: function(otherPersonsName) {
    	console.log("hello" + otherPersonsName);
    }
}
// 객체 내부의 함수 실행
player.sayHello("nico");

✔Returns

✔Conditionals