Javascript/Vanilla JS

[Javascript] 기초 요약

  • -
728x90

 

간단한 웹페이지를 만들기위해 조금 건드려봤던 javascript를 빠르게 요약해보자.(vscode 단축키와 같이)

 

[! + tab] (vscode 단축키) : html 기본 틀 작성

[(tag). + tab] (vscode 단축키) : tag를 입력하지 않고 tab을하면 div tag가 기본으로 class명을 부여하여 태그가 생성된다.

[(tag)# + tab] (vscode 단축키) : tag를 입력하지 않고 tab을하면 div tag가 기본으로 id명을 부여하여 태그가 생성된다.

 

변수 type

  • var :  ES6 이전 버전에서 쓰이던 변수. 중복 선언이 가능하다. 따라서 코드의 길이가 길어지면 에러를 발생시킬 수 있는 가능성이 커진다.
  • let : var과 같은 변수이지만, 중복 선언이 불가능하다. var의 단점을 보완하여 ES6 이후 추가되었다.
  • const : 중복 선언이 불가능하고, 재할당도 불가능하다. 즉, 상수이다.

 

배열 (Array)

const daysOfWeek = ["Mon","Tue","Wed","Thu","Fri","Sat","Sun",true];
위와 같이 선언할 수 있는데 변수 type은 구애받지 않는다.
물론 인덱스로 접근도 가능하다.
console.log(daysOfWeek); -> ["Mon","Tue","Wed","Thu","Fri","Sat","Sun",true]
console.log(daysOfWeek[0]); -> Mon

 

 

비교 연산

 a, b를 비교하여 참(true), 거짓(false)를 반환

  • a == b : a와 b의 값이 같으면 true, 다르면 false
  • a != b : a와 b의 값이 같지 않으면 true, 같으면 false
  • a === b : a와 b의 값과 데이터 형식까지 같으면 true, 그렇지 않으면 false
  • a !== b : a와 b의 값과 데이터 형식 중 적어도 하나라도 다르면 true, 그렇지 않으면 false

 

객체 (Object)

javascript에서 객체 선언은 변수에 중괄호를 이용하여 작성한다. const로 선언했지만 객체 안의 변수들은 재할당이 가능하다. 하지만 객체 자체의 변경은 불가능 하다.

const wonieeInfo ={
    name: "Woniee",
    gender: "Male"
    isHandsome: true;
}
  
wonieeInfo.isHandsome = false; 

javascript에서는 함수이름이 필요하지 않다면 이름없이 선언할 수 있다.(익명함수)

const wonillismInfo ={
  name: "wonillism",
  gender: "Male",
  isHandsome: true
}

wonillismInfo.isHandsome = false;
wonillismInfo.printName = function (){
  console.log(this.name)
}
wonillismInfo.printName();

 

생성자를 이용한 객체 선언

function Person(username, age) {
  this.username = username;
  this.age = age;
  this.printUsername = function () {
    console.log(this.username)
  }
}

let p1 = new Person("wonillism", 20);

 

728x90
300x250
Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.