본문 바로가기

JavaScript8

[JavaScript] 비동기 처리 아래의 그림을 보면 동기적 처리와 비동기적 처리를 간단하게 확인할 수 있습니다. 대충 이해가 가시나요? 그림만 보고 정확하게 이해하기는 힘드니 어떤 상황에 사용하는지 어떤 의미인지 알아보겠습니다. \\^-^// 1. 비동기 처리 자바스크립트에서 비동기 처리는 특정 코드의 로직이 끝나는 것을 기다리지 않고 다음 코드를 먼저 실행하는 것을 의미합니다. 동기적 처리는 비동기 처리와 반대로 특정 코드의 로직이 끝나면 다음 코드가 실행되는 것을 말합니다. 비동기적 처리는 작업의 흐림이 끊어지지 않기 때문에 동시에 여러 로직을 처리할 수 있고, 다른 함수를 가져와 사용할 수 있습니다. 예를 들어 한번 보겠습니다. console.log('First'); setTimeout(function() { console.log.. 2021. 9. 3.
[JavaScript] 콜백 함수 (Callback Function) 콜백 함수를 처음 들으면 다시 부르다? 어떠한 의미인지 한 번에 파악하기 힘듭니다. 오늘은 callback 함수가 무엇인지 어떠한 함수인지 알아보겠습니다. :> 1. 콜백 함수 콜백 함수는 다른 함수의 매개변수로 함수를 넘겨주고, 어떠한 이벤트가 발생했거나 특정 시점에 도달했을 때 호출하는 함수를 말합니다. 예시를 들어 설명하겠습니다. 음식점에 주문을 하려고 합니다. 그런데 음식점의 주문이 밀려 지금 당장 해줄 수 없다고 합니다. 그렇다면 음식 준비가 끝나면 음식을 받아갈 테니 전화를 달라고 부탁합니다. 전화가 오기 전까지 자신이 하고 싶은 일을 할 수 있습니다. 이때 음식점에서 전화가 걸려오고 받는 것이 콜백 함수가 호출되는 시점과 같습니다. 2. 콜백 함수 사용법 간단한 콜백 함수의 예로 살펴보겠습니.. 2021. 9. 3.
[JavaScript] this 자바스크립트의 this는 함수를 호출하는 방법에 의해 결정됩니다. this가 사용되는 함수를 어떤 방식으로 실행하느냐에 따라 this의 역할이 구분된다는 것입니다. 글로만 읽어서는 어떠한 의미인지 이해하기 어려우니 4자지 방식을 예를 들어 설명하겠습니다. 1. 일반 함수에서 this 먼저, 일반 함수에서 this는 전역개체(window)를 말합니다. console.log(this); // window 2. 객체 메서드에서 this 객체 메서드로 호출되는 경우에 this는 해당 객체를 가리키게 됩니다. var test = { mtd : function() { console.log(this); } } test.mtd(); // test 여기서 중요한 것은 객체의 메서드로 호출되는 경우라는 것을 기억해야 합니.. 2021. 9. 3.
[JavaScript] 변수 (var, let, const) 변수는 대부분의 프로그래밍 언어를 배울 때 가장 처음 배우는 개념입니다. 변수를 모른다면 프로그램을 작성한다거나 간단한 사칙연산, 복잡한 식의 계산을 처리하기 어려울 것입니다. 그렇다면 변수가 어떠한 것인지 알아보겠습니다! : ) 1. 변수 아래는 자바스크립트에서 변수 v을 선언한 모습입니다. var v; 변수는 어떠한 곳에 사용되는 것일까요? 변수는 데이터를 저장하기 위한 공간 입니다. 간단하게 비유하자면, 변수는 어떠한 값을 저장하는 그릇과 같다고 볼 수 있습니다. 위의 변수에는 지금 아무런 값도 할당되어 있지 않아 undefined라는 초기 값을 가지고 있습니다. 변수 값 할당 변수는 값을 저장할 수 있다고 위에서 설명했습니다. 그렇다면 어떻게 하면 값을 저장할 수 있을까요? var v = 10; .. 2021. 9. 1.