반응형
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- Vue.js
- jsx
- CSS
- Vue
- webpack
- JavaScript
- HOC
- App.vue
- 리액트
- State
- scss
- mapGetters
- 자바스크립트
- react
- input
- Vue transition
- v-html
- vuex
- MySQL
- 댓글달기
- Wecode
- nodejs
- TypeScript
- storybook
- event
- ES6
- 자료구조
- 쉬운설명
- express
- sass
Archives
- Today
- Total
익명의 개발노트
Closure 본문
반응형
클로져란?
1) 외부함수의 변수에 접근할 수 있는 내부 함수( 외부함수가 실행 종료되어 소멸했음에도 불구하고 내부함수는 외부함수의 변수에 접근가능)
2) scope chain으로 표현되기도 함
3) 보통함수를 return 하여 사용
4) return 하는 내부함수를 클로져 함수라고 지칭
<한번 생각해 보기>
function outer() {
console.log('outer fn invoked');
function inner() {
console.log('inner fn invoked');
}
return inner;
}
outer(); // → outer fn invoked,
ƒ inner() {
console.log('inner fn invoked');
}
outer()(); // → outer fn invoked, inner fn invoked
var innerFn = outer(); // → outer fn invoked
innerFn(); // → inner fn invoked
클로져가 가지는 3가지 scope chain
1) 클로져 자신에 대한 접근(closure function 내에 정의된 변수)
2) 외부 함수의 변수에 대한 접근
3) 전역 변수에 대한 접근
ㅇㅇㅇ
var greeting = 'Hello'; // 전역 변수에 대한 접근 가능
var nameIntro = 'My name is ';
function makeFullName() {
// 이 내부 함수(makeFullName)는 외부 함수(showName)의 변수뿐만 아니라 파라미터 까지 사용할 수 있다.
return greeting + ', ' + nameIntro + firstName + ' ' + lastName;
}
return makeFullName();
}
showName('Michael', 'Jackson');
// Hello, My name is Michael Jackson
반응형
'프로그래밍 > javascript' 카테고리의 다른 글
IIFE( Immediately Invoked Function Expression) (0) | 2019.02.27 |
---|---|
this (0) | 2019.02.26 |
Scope (0) | 2019.02.26 |
[디버깅] 크롬을 활용한 디버깅하는 법 (0) | 2019.02.22 |
[배열] 내장 메서드 (0) | 2019.02.19 |
Comments