Javascript(173)
-
[Javascript] String 메서드
String 객체는 원시 타입인 문자열을 다룰 때 유용한 프로퍼티와 메서드를 제공하는 wrapper 객체이다. 변수 또는 객체 프로퍼티가 문자열을 값으로 가지고 있다면 String 객체를 별도 생성하지 않고도 String 객체의 프로퍼티와 메서드를 사용할 수 있다. 원시 타입인 String이 객체의 메서드를 사용할 수 있는 이유는 원시 타입으로 프로퍼티나 메서드를 호출할 때 원시 타입과 연관된 wrapper 객체로 일시적으로 변환되어 프로토타입 객체를 공유하게 되기 때문이다. var str = "문자열"; // 리터럴 문자열 생성var len = str.length; // 문자열 프로퍼티인 length 사용 위 예시에서 생성한 문자열 리터럴 str은 객체가 아님에도 불구하고 length 프로퍼티를 사용할..
2025.07.07 -
[Javascript] 비동기 처리 - (3) async/await
async/await에 대해 알아보기 전에 먼저 자바스크립트에서 Promise를 이용해 비동기 처리를 어떻게 해왔는지 간단히 살펴 보자. 예를 들어 특정 게시물의 작성자 이름을 가져오는 함수는 다음과 같이 작성할 수 있다.function fetchAuthorName(postId) { return fetch(`https://jsonplaceholder.typicode.com/posts/${postId}`) .then((response) => response.json()) .then((post) => post.userId) .then((userId) => { return fetch(`https://jsonplaceholder.typicode.com/users/${userId}`) ..
2025.07.03 -
[Javascript] 비동기 처리 - (2) Promise
지난 포스팅에서 언급했던 비동기 처리의 콜백 함수는 엄연히 말하자면 비동기를 순차적으로 처리하기 위한 일종의 편법 같은 것이지 정식으로 지원하는 비동기 전용 함수가 아니다. 따라서 Promise 객체는 이러한 한계점을 극복하기 위해 비동기 처리를 위한 전용 객체로 탄생하게 되었다. Promise는 비동기 작업의 성공 또는 실패와 그 결과 값을 나타내는 객체로 비동기 작업을 쉽고 깔끔하게 연결할 수 있도록 해준다. 콜백 함수를 통한 비동기 처리의 문제점ES6에 Promise가 도입되어 지금처럼 널리 사용되기 이전에는 아래와 같이 주로 콜백 함수를 다른 함수의 인자로 넘겨 비동기 처리해왔다. findUserAndCallBack(1, function (user) { console.log("user:", ..
2025.07.02 -
[Javascript] 비동기 처리 - (1) 콜백 함수
콜백 함수는 흔히 비동기를 다룰 때 자주 엮여 등장하는 개념이다. 콜백 함수는 자바스크립트의 일급 객체 특성을 이용해 함수의 매개변수에 함수 자체를 넘겨 함수 내에서 매개변수 함수를 실행하는 기법을 말한다. 자세한 내용은 아래 포스팅 참조 [Javascript] 콜백 함수콜백(Callback) 함수. 간단히 말하면 파라미터로 함수 객체를 전달해서 호출 함수 내에서 파라미터로 전달된 함수를 실행하는 것을 말한다.예를 들어 아래 코드와 같이 sayHello() 함수를 호출할때 파developing-move.tistory.com 콜백 함수먼저 사용자 ID를 파라미터로 받아 DB나 API 연동 없이 임의의 사용자 객체를 반환하는 함수를 만들어 보는 것으로 시작하려 한다.function findUser(id)..
2025.07.01 -
[Javascript] 비동기의 특징
자바스크립트의 동기와 비동기자바스크립트는 싱글 스레드 언어이기 땜누에 한 번에 하나의 작업만 수행할 수 있다. 즉 이전 작업이 완료되어야 다음 작업을 수행할 수 있게 된다는 얘기다. 우리가 프로그래밍을 하면서 일반적으로 각 함수와 코드들이 위에서 아래로 차례대로 동작하는 방식이라고 할 수 있다. 이러한 코드의 순차 실행을 동기(Synchronous)라고 부른다. 동기 방식은 간단하고 직관적이지만 작업이 오래 걸리거나 응답이 늦어지는 경우 전체적인 성능과 사용자 경험에 영향을 줄 수 있다. 예를 들어 서버에 데이터를 요청하고 응답을 받아야 하는 작업이 있다면 응답이 올 때까지 다른 작업을 하지 못하고 대기해야 하기 때문이다. 이렇게 되면 프로그램의 흐름이 멈추거나 지연될 수 있다.따라서 자바스크립트는 여러..
2025.06.30 -
[Javascript] 이벤트 루프
자바스크립트는 싱글 스레드 언어라는 말을 들어본 적이 있는가? 싱글 스레드는 스레드가 하나뿐이라는 것으로 한 번에 하나의 작업만 처리할 수 있다는 것을 의미한다. 반면 Java나 Python는 멀티 스레드를 지원하여 원하는 코드 로직을 동시에 수행시키는 멀티 작업이 가능하다. 그런데 웹 애플리케이션에서는 네트워크 요청이나 이벤트 처리, 타이머와 같은 작업을 멀티로 처리해야 하는 경우가 많다. 만약 싱글 스레드로 브라우저 동작이 한 번에 하나씩 수행하게 되면 우리가 파일을 다운로드 받을 동안 브라우저는 파일을 다 받을 때까지 아무것도 못하고 멈춰서 대기해야 할 것이다. 따라서 파일 다운로드, 네트워크 요청, 타이머, 애니메이션 같은 오래 걸리고 반복적인 작업들은 자바스크립트 엔진이 아닌 브라우저 내부의 멀..
2025.06.27