개발노트/JavaScript
문제가 된 부분 export class DaumCafeApp extends Crawler { private articleList: IDaum.ViewersBuzz [] = []; async function run(): Promise { function test() { const data = this.articleList; } } } 중첩된 함수 내에서 this를 사용하여 클래스 필드에 접근하려고 할 때 발생 중첩된 함수 내에서의 this context가 class instance this context와 다르기 때문 함수 내의 this는 자기 자신의 context를 가지기 때문에 class instance this context에 접근할 수 없다.
돌고 돌아 이번 발표 주제는 자바스크립트의 획득자 (get), 설정자 (set) 의 주제를 맡게 되었다. 먼저 자바스크립트에서의 property는 data property, accessor property 이렇게 두 종류로 나뉜다. data property (데이터 프로퍼티) data property는 값을 저장하기 위한 프로퍼티 이며, 일반적으로 자바스크립트에서 사용하는 프로퍼티의 경우 data property에 속한다. accessor property (접근자 프로퍼티) data property와 다르게 accessor property는 값이 존재하지 않는다. 가상의 property로 읽고 쓸 수는 있지만 실제로 존재하지 않는 property 이다. (획득자 getter. 설정자 setter 메서드로..
지금의 회사에서는 매주 수요일 마다 개발 내용으로 주간 스터디를 진행하고 있다. (안바쁜 달 한정 매 주) (개발에 관련한 내용이라면 아무 얘기나 가능~!) 스터디라고 해서 거창한건 없고, 한 주에 1명씩 돌아가면서 정해진 주제를 가지고 간단하게 팀원에게 소개하는 자리인데, 이번 주는 내 차례였다. 내가 맡은 주제는 자바스크립트의 옵셔널 체이닝 근데 왜 이 글의 제목은 this 인 것인가... 왜냐면... 내가 설명한 부분에서 잘못된게 있었다. 내가 맡았던 옵셔널 체이닝 부분 포스팅이다. 더보기 https://pmirnc-dev.github.io/javascript/2023/01/24/Optional-Chaining.html JavaScript Optional Chaining 안녕하세요 PMI(피앰아이)..
Promise 자바스크립트 비동기 처리에 사용되는 객체 💡 비동기 처리란? 특정 함수의 실행이 끝날 때까지 기다리지 않고 다음 함수를 실행하는 과정 비동기 처리는 순차적으로 처리하지 않는다는 특징이 있는데, 상황에 따라서 비동기 처리를 했을때 순차적으로 처리해야할 때가 있다. 이때 프로미스 객체를 사용하여 비동기임에도 불구하고 순차적으로 처리할 수 있다. Promise의 처리 상태 3가지 Pending(대기) : 비동기 처리가 아직 완료되지 않은 상태 Fulfilled(이행) : 비동기 처리가 완료되어 프로미스가 결과 값을 반환해준 상태 Rejected(실패) : 비동기 처리가 실패하거나 오류가 발생한 상태 new Promise()를 통하여 프로미스 객체를 생성하고 인자 값으로는 콜백 함수를 넣는다. 이..
자바스크립트의 filter 함수는 조건을 주고 해당 조건이 참인 요소를 모아 새로운 배열을 만들어 반환하는 함수이다. ** 새로운 배열을 만들지만 중복값을 제거해주지는 않기 때문에 배열 요소가 중복될 수 있다. 기본 구문 arr.filter(callback(element[, index[, array]])[, thisArg]) callback : 각 요소에 대한 조건값 element : 처리할 현재 요소 index : 현재 인덱스 array : filter를 호출한 배열 thisArg : callback을 생성할 때 this로 사용하는 값 특징 값이 존재하는 인덱스에 대해서만 호출이 된다. 삭제 또는 값이 없는 배열은 filter 함수가 실행되지 않는다. 기존 배열의 값을 변경하지 않는다. 처리되는 범위는..
jQuery를 통하여 Ajax를 구현하는 방식을 사용했었다. 이번 Nodejs를 공부하면서 jQuery를 사용하지 않고 순수 자바스크립트로만으로 Ajax 기능을 구현해보았다. 예제 //조회 document.querySelector('#searchBtn').addEventListener('click',function(){ var data = document.forms[0].elements[0].value; sendData('http://localhost:3333/search',data); }); function sendData(url,data){ var result = { 'search': data } result = JSON.stringify(result); var xhr = new XMLHttpRequ..