본문 바로가기

개발/프론트엔드

java script - 2. 기초 문법 - 초급

기본적은 프로그래밍은 할 줄 안다고 가정하고 javascript의 문법과 특징들에 대해 간략히 설명할 예정입니다.

 

출력

console.log("~~~")로 출력합니다.

console.log("hello world!")

//hello world!

변수

let, const가 있습니다(var도 있긴 한데 안 쓰는 것을 추천합니다). let은 재할당 가능한 변수, const는 재할당이 불가능한 변수입니다.

//let
let a = 1;
console.log(a); // 1

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

//const
const b = 1;
console.log(b); // 1

//error
// b = 100;
// console.log(b);

 

반복문

다른 언어들과 비슷하게 for와 while을 사용합니다. continue와 break도 똑같이 사용합니다.

for (let i = 0; i < 10; i++) {
    if (i === 3) {
        console.log("It is 3");
        continue;
    }
    if (i === 5) {
        break;
    }
    console.log("Number " + i);
}

/*
Number 0
Number 1
Number 2
It is 3
Number 4
*/

let i = 0;
while (i < 5) {
    console.log("number " + i);
    i++;
}
/*
number 0
number 1
number 2
number 3
number 4
*/

 

조건문

다른 언어들의 if와 비슷합니다. 다음과 같은 형식을 따릅니다.

if(~~) {} else if(~~) {} else {}

로 사용합니다.

a = 9;
if (a < 5) {
    console.log("5보다 작음");
} else if (a < 10) {
    console.log("10보다 작음");
} else {
    console.log("큼");
}

// 10보다 작음

 

함수

function(파라미터){내용}

으로 구성되어 있습니다.

function square(num) {
    console.log(num * num);
}

square(10);

// 100

 

특징

호이스팅

함수 같은 경우 호출을 먼저 하고 함수 선언을 나중에 해도 됩니다. 대부분의 언어는 함수 선언을 한 다음 사용할 수 있습니다. (사실 변수의 var도 호이스팅이 되지만 쓰지 않을 것이기 때문에 넘어가도록 하겠습니다.)

square(10);

function square(num) {
    console.log(num * num);
}

//100

 

배열

배열 같은 경우 다음과 같은 방법으로 순회할 수 있습니다.. 또한 length로 길이를 반환할 수 있습니다.

x = ["a", "b", "c", "d"];

for (const item of x) {
    console.log(item);
}

console.log(x.length) // 4

 

'개발 > 프론트엔드' 카테고리의 다른 글

react - 소스 코드로 페이지 전환  (0) 2024.09.20
react - 페이지 전환  (0) 2024.09.13
react - 헤더, 페이지 만들기  (0) 2024.09.12
java script - 1. 환경설정  (0) 2024.05.11