자바스크립트 썸네일형 리스트형 Iterator / Generator 안녕하세요. 꼬동입니다. 현재 저는 다양한 준비를 하고 있는데, 그 준비과정에서 만난 JS의 Iterator / Generator에 대해서 자세히 알아보려고 합니다. 갑시다 ! 이터레이터는 '지금 어디 있는지' 파악할 수 있도록 돕는 책갈피와 비슷한 개념입니다. 배열은 이터러블 객체의 좋은 예인데, 배열에 values 메서드를 써서 이터레이터를 만들 수 있습니다. 이 상태에서 next 메서드를 호출하면 value 프로퍼티와 done 프로퍼티를 반환합니다. const it = [1,2,3].values(); it.next() // {value: 1, done: false} it.next() // {value: 2, done: false} it.next() // {value: 3, done: false} i.. 더보기 실행 컨텍스트와 클로저 안녕하세요 ! 다들 새해 복 많이 받으시고 있나요 !! 안 받으시고 있으시다면, 어서 챙겨가세요 !! 이번 글에선 실행 컨텍스트와 클로저를 배워 보려고 합니다. 저는 항상 클로저라는 개념이 어렵게 다가왔었는데, 그 이유가 실행 컨텍스트라는 개념을 몰라서 어렵게 느껴졌던거 같아요. 그러니 이번엔 '실행 컨텍스트와 클로저'를 같이 배워보려합니다. 정확히는 아래를 배울 거에요 ! 실행 컨텍스트의 개념 활성 객체와 변수 객체 스코프 체인 클로저 시작합니다 ! 실행 컨텍스트 개념 기존에 언어를 공부해보셨다면 Call Stack의 개념을 들어보셨을 거에요. C언어로 예를 들면 함수의 호출 정보, 지역 변수, 인자값 등이 차곡차곡 쌓이는 스택을 의미해요. 그래서 콜 스택의 호출 정보 등으로 코드의 실행 과정을 추적하.. 더보기 JavaScript 함수와 프로토타입 체이닝 (5) 드디어 JavaScript 함수 마지막 글입니다. 여기까지 읽으신 분이 있으신진 모르겠지만, 읽으셨다면 추후에 큰 도움 되실겁니다. 다 기억까지한다면 베스트 ! 프로토타입 체이닝 프로토타입의 두 가지 의미 JS는 기존 C++이나 자바 같은 객체지향 프로그래밍 언어와는 다른 프로토타입 기반의 객체지향 프로그래밍을 지원합니다. JS에서 OOP 상속에 근간이 되는 프로토타입과 프로토타입 체이닝의 기본 개념을 알아보도록 합시다. 자바와 같은 객체지향 프로그래밍에서는 클래스를 정의하고 이를 통해 객체를 생성합니다. JS에는 이러한 클래스 개념이 없습니다. 대신에 객체 리터럴이나 앞서 설명했던 생성자 함수로 객체를 생성합니다. 이렇게 생성된 객체의 부모 객체가 바로 '프로토타입' 객체입니다. 즉, 상속 개념과 마찬.. 더보기 JavaScript 함수와 프로토타입 체이닝 (3) 함수의 다양한 형태 1. 콜백 함수 자바스크립트 함수 표현식에서의 함수 이름은 선택 사항입니다. 이러한 익명 함수의 대표적 용도가 콜백 함수입니다. 콜백 함수는 코드를 통해 명시적으로 호출하는 함수가 아니라 이벤트가 발생하거나 특정 시점에 도달했을 때 시스템에서 호출되는 함수를 말합니다. 대표적인 콜백 함수의 사용 예가 이벤트 핸들러 처리가 되겠죠. window.onload = function() { alert('This is the callback function.'); }; 2. 즉시 실행 함수 함수를 정의함과 동시에 바로 실행하는 함수를 즉시 실행 함수라고 합니다. 이 역시 익명 함수를 응용한 형태입니다. (function (name) { console.log('This is the immediat.. 더보기 JavaScript 함수와 프로토타입 체이닝 (2) 시간이 없어요 !! 바로 시작합시다. 함수 객체 : 함수도 객체다 자바스크립트에서는 함수도 객체다 자바스크립트에서는 함수도 객체입니다. 즉, 함수의 기본 기능인 코드 실행 뿐만 아니라, 함수 자체가 일반 객체처럼 프로퍼티들을 가질 수 있다는 것입니다. function add(x, y) { return x + y; } add.result = add(3, 2); add.status = 'OK'; console.log(add.result); // '5' console.log(add.status); // 'OK' 앞서 설명한 것처럼 자바스크립트는 일반 객체처럼 취급될 수 있단 점을 알고가야합니다. 리터럴에 의해 생성 변수나 배열의 요소, 객체의 프로퍼티 등에 할당 가능 함수의 인자로 전달 가능 함수의 리턴값으로.. 더보기 JavaScript 함수와 프로토타입 체이닝 (1) 안녕하세요 되게 오랜만이네요 ! 오늘 12월 13일, 제 생일에 맞춰서 글을 써보려 합니다. 글 주제는 JavaScript 함수와 프로토타입 체이닝인데, 저번 글에서 JavaScript 함수에 관해 글을 썼는데, 너무 성의 없었나해서 블로그에 다시 글을 남겨보려 합니다 ! 본 글은 아마 프론트엔드 개발자라면 분명히 알고 있어야하는 개념인거 같고, 면접에서도 자주 나올 법한 이야기가 아닐까 싶네요 ! 시작해볼게요 ! 자바스크립트에서 가장 중요한 개념 1순위는 뭘까요? 당연히 함수입니다. 제가 처음 자바스크립트를 공부하면서 이 함수 부분에서는 굉장히 헷갈리는 부분이 많았습니다. 기존에 알고있던 Python, C 언어와는 뭔가 다른 느낌이었거든요. 자바스크립트에서는 이 함수를 얼마나 제대로 이해하고 활용하느냐.. 더보기 JAVASCRIPT - 함수 (ES6 함수 선언 포함) 제가 요새 JAVASCRIPT 책을 읽고 있는데, 함수 설명이 너무 잘 되어 있더라고요. 항상 애로우 function, 익명 함수에 대해서 헷갈리고, call / apply / bind 개념이 헷갈렸는데, 이 책을 읽으니 너무 이해가 잘 됐습니다. 그래서 공유하려고 왔어요 !! github.com/rrkkee015/Learning-JAVASCRIPT/tree/master/6%EA%B0%95 rrkkee015/Learning-JAVASCRIPT 러닝 자바스크립트 : ES6로 제대로 입문하는 모던 자바스크립트 웹 개발. Contribute to rrkkee015/Learning-JAVASCRIPT development by creating an account on GitHub. github.com 제 깃허브.. 더보기 이전 1 다음
