본문 바로가기
Language/JavaScript

[javaScript] 기초 문법

by 계범 2022. 2. 19.

변수(variable)

  • let: 재선언 불가, 재할당 가능
  • const: 재선언 불가, 재할당 불가
  • var: 재선언 가능, 재할당 가능 
let a = 5;
a = 6; // 재할당 가능
let a = 6; // 재선언 불가

const b = 5;
b = 6; // 재할당 불가
const b = 6; // 재선언 불가

var c = 5;
c = 6; // 재할당 가능
var c = 6; // 재선언 가능

 

var은 예전 문법이므로, 더이상 쓰지 않는다.

대부분 const로 선언하여 사용하고, 재할당해서 사용할 필요가 있을 경우에만 let을 사용한다.

 

브라우저 콘솔 출력방법

  • console 함수 사용
console.log(5); // 5 출력
console.log("hello! " + "haebum"); // hello! haebum 출력
console.log("hello!" , "haebum"); // ,를 통해 구분해서 넣으면, 따로 띄워쓰기를 넣지 않아도 띄워서 나옴

 

연산(operator) 및 연산자(===, &&, ||)

const a  = 5;
const b = 2;

console.log(a + b); // 7 더하기 연산
console.log(a - b); // 3 빼기 연산
console.log(a * b); // 10 곱하기 연산
console.log(a / b); // 2.5 나누기 연산
console.log(a ** b); // 25 제곱 연산
console.log(a % b); // 1 나머지 연산


a === b  // a와 b가 같아야 true 반환
a !== b // a와 b가 같지 않으면 true 반환
a && b  // a와 b가 둘다 true여야 true 반환
a || b // a나 b 둘중에 하나가 true 면 true 반환

 

배열(array)

// 배열 선언 (타입 통일할 필요 없음)
const dayOfWeek = ["mon", "tue", "wed", "thu", "fri", "sat"];
const nonesense = [1, 2, "hello", false, null, true, undefined, "hae"];

//* 타입 설명
// undefined 는 선언만 해놓고 내용이 있지 않은 것.
// null 은 아무것도 없는 값으로 내용을 채워 놓은 것.

//배열 내 원소 찾기
dayOfWeek[5];

// 배열 내 원소 추가( 가장 끝으로 추가 됨)
dayOfWeek.push("sun");

// 배열 내 원소 수정
dayOfWeek[5] = "Saturday";

// 배열 내 원소 삭제
dayOfWeek.pop(); // 배열의 마지막 요소를 삭제하고 반환값으로 전달
dayOfWeek.shift(); // 배열의 첫번째 요소를 삭제하고 반환값으로 전달
delete dayOfWeek[5]; // 배열의 해당 요소의 값만 삭제. 자리는 유지되어 empty로 들어가 있음.

// 배열에서 부분집합 따로 빼기
const sub = dayOfWeek.splice(1,2); // index기준으로 1~2까지의 원소를 빼서 별도의 배열 생성.

// dayOfWeek = ["mon", "thu", "fri", "sat"]; splice한 원소들은 빠져있음.
// sub  = ["tue", "wed"]; splice를 통해 만들어진 배열

 

객체(object)

// object(객체) 생성
const player = {
    name: "haebum",
    points: 10,
    fat: true,
};

//객체 및 객체 프로퍼티 부르기
console.log(player);
console.log(player.name);
console.log(player["name"]);

// object 타입이 const여도 property 변경은 가능
player.fat = false;
player.points = player.points + 15

// object에 property 추가
player.lastName = "potato";

// object에 property 삭제
delete player.lastName;

 

함수(function)

function plus(a,b){
    console.log(a+b);
}

plus(1,3);
// argument를 2개 초과해서 보내도 앞에서부터 정해진 개수만 인식하여 함수 실행

// return 함수의 반환값은 return을 통해 반환
const age = 96;
function calculateKrAge(ageOfForeigner){
    return ageOfForeigner+2;
}

const krAge = calculateKrAge(age);
console.log(krAge); // 96+2 = 98 출력됨.

 

조건문(if)

// 조건문

const age2 = prompt("How old are you?"); // 입력값 받는 팝업창을 띄워 입력값을 반환함

console.log(typeof age2); // 타입 확인 방법
console.log(parseInt(age2)); // string -> number 변환

const age = parseInt(prompt("How old are you?")); // 숫자가 맞으면 숫자, 아니면 NaN 반환
isNaN(); //NaN인지 판별하여 boolean값 반환 함수

if(isNaN(age)){
    // condition == true 일때 아래 조건 실행
    console.log("Please write a number");
} else if(age < 18){
    // 위의 조건에 해당하지 않으면서, 현재 조건에 해당할때 실행
    console.log("Yout are too young");
} else{
    // 위의 조건들이 다 해당하지 않을때 실행
    console.log("You can't drink");
}

 

참조

노마드코더 자바스크립트 강의

댓글