오지이 오지이

# try...catch 문 자바스크립트에서는 오류를 try...catch를 통해 관리할 수 있습니다. try...catch문은 실행할 코드를 try 블록에 작성하고, 예외(exception)가 발생(throw)할 경우 예외에 대한 처리를 지정합니다. 예제를 통해 정의되지 않은 함수를 호출하여 발생하는 예외 처리를 보여 드리겠습니다. try { nonExistentFunction(); // 존재하지 않는 함수 호출 } catch(error) { console.error(error); // ReferenceError: nonExistentFunction is not defined } finally { console.log('try 코드 블록이 정상적으로 수행되든, 오류를 발생시키든 상관없이 무조건 실행해야..

# Class 소개 클래스는 객체를 생성하기 위한 템플릿입니다. 클래스는 데이터와 이를 조작하는 코드를 하나로 추상화합니다. 쉽게 말해 클래스는 하나의 틀입니다. 이해하기 어려운 분들을 위해 예시를 들어 보겠습니다. 타코야끼를 만들 때 타코야끼 틀에 반죽과 문어를 넣어 구워내죠. 이때 타코야끼 틀이 클래스의 역할을 한다고 생각하시면 됩니다. 이렇게 클래스르 만들어 놓으면 클래스를 사용하는 곳에서는 사전에 정의된 틀(클래스 내에 정의된 내부 함수, 내부 변수가 있습니다.)에 맞춰서 코드를 구현해 주면 표준화된 결과를 만들어 낼 수 있습니다. # Class 정의 클래스는 크래스명 앞에 class라는 키워드를 사용해서 정의할 수 있습니다. 그리고 반드시 constructor 함수를 가져야 합니다. constr..

# 모듈이란? 모듈은 분리된 각각의 자바스크립트 파일이고 이러한 각 파일은 특정한 목적을 가진 여러 개의 함수로 구성된 라이브러리라고 이해하시면 됩니다. 자바스크립트로 구현하는 함수를 기능별로 분리하고 필요한 곳에서 호출하여 사용 가능하게끔 자바스크립트 파일을 물리적으로 분리하여 사용할 수 있게 해 줍니다. 이는 웹 애플리케이션의 크기가 커지는 과정에서 요구되기도 했습니다. # 모듈 지시자 모듈은 export, import 지시자를 사용하여 다른 모듈에서 불러와 사용할 수 있도록 구성 가능합니다. export - 해당 지시자를 변수나 함수 앞에 붙이면 다른 외부 모듈에서 해당 변수나 함수를 import 해서 사용할 수 있습니다. import - 해당 지시자를 사용하여 다른 외부 모듈을 가져와 사용할 수 ..

# Async/Await란? 사용 목적은 Promise와 동일합니다. 둘 다 단어 뜻 그대로 Async는 비동기 실행을, Await은 비동기를 실행하는 데 결과가 올 때까지 기다리겠다는 의미를 가지고 있습니다. # Promise도 있지 않나요? 네, 맞습니다. Promise와 Async/Await의 차이를 Fetch API를 통해 알아보도록 하겠습니다. 우선 Fetch API는 그 자체가 Promise입니다. 아래의 예제 코드처럼 서버로부터 응답이 오면 then() 함수를 통하여 응답받은 결과를 이용한 코드를 작성할 수 있습니다. function myFunction() { fetch("https://jsonplaceholder.typicode.com/posts/1") .then((response) => ..

목차 Promise란? 왜 Promise를 쓰는가? Promise 사용법 코드 예제 # Promise란? 자바스크립트에서 비동기 처리에 사용되는 객체입니다. 이때, 비동기 처리란 특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 실행할 수 있게 해 주는 방식을 뜻합니다. # 왜 Promise를 쓰는가? 원래 웹은 '앞에서부터'의 규칙을 가지고 있습니다. 요청(request)에 대한 반응(response)이 순서대로 이루어지고, 먼저 실행된 코드가 실행 완료 되어야 다음 코드를 실행하는 것처럼요. 그런데 자바스크립트에 Ajax(Asynchronous JavaScript and XML)이 추가되면서 XMLHTTPRequest 통신이 가능해졌고, 이를 통해 서버로 요청을 보낸 후 요청에 대한 응답을..