본문 바로가기

Frontend/Javascript9

Javascript - Promise 콜백 지옥을 탈출하는 새로운 문법자바스크립트에서 '비동기 처리' 란 현재 실행중인 작업과는 별도로 다른 작업을 수행하는 것을 말한다.예를 들어 서버에서 데이터를 받아오는 작업은 시간이 걸리기 때문에 자바스크립트의 서버 호출 함수는 비동기 함수(링크)로 이루어져 있다.비동기는 특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행하는 방식이기 때문에, 만일 비동기 작업의 결과에 따라 다른 작업을 수행해야 할 때는 전통적으로 콜백 함수를 사용했다. 콜백 함수란 비동기 작업이 완료되면 호출되는 함수의 의미로서, 비동기 함수의 매개변수로 함수 객체를 넘기는 기법을 말한다. 그래서 함수 내부에서 함수 호출을 통해 비동기 작업의 결과를 받아서 인자로 주면 이를 통해 후속 처리 작업을 수행할 수 있다.. 2024. 12. 21.
Javascript - this this란?JS에서 실행 컨텍스트에 따라 다르게 바인딩되는 객체this는 함수의 블록 스코프 내에서 선언되어야 작동 cf) 실행 컨텍스트란? - 실행할 코드에 제공할 환경 정보들을 모아놓은 객체let group = { title: "1모둠", students: ["보라", "호진", "지민"], title2 : this.title, title3() { console.log(this.title) }};console.log(group.title2); //undefinedgroup.title3(); // 1모둠  this의 기본 동작 원리'this'는 함수가 호출되는 방식에 따라 다르게 동작함- 일반 함수로 호출될 때: 전역 객체를 가리킴- 메소드로 호출될 때: 해당 메소드를 호출한 객체를 가리킴 왜냐.. 2024. 12. 21.
Javascript - Array의 map, reduce, forEach, filter 메소드 array.map()- 배열(array)내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 가진 새로운 배열을 만들어냄- 쉽게 말해, 맵 메서드로 맵핑해준다(매개변수로 함수가 들어가면 callback이라 함)let numbers = [1, 4, 9]let roots = numbers.map(function(num){ return Math.squrt(num)})//roots = [1, 2, 3]//numbers = [1, 4, 9]  array.reduce()- 배열의 각 요소에 대해 주어진 reducer 함수를 실행하고 하나의 결과값 반환- 배열 축소의 원리로 작용. 즉 여러개의 값이 담긴 배열이 줄어서 최종적으로 하나의 값으로 만드는 과정[0,1,2,3,4].reduce(function(acc.. 2024. 12. 21.