본문 바로가기

javascript/javascript 심화지식16

클로저(Closure) 클로저(closure)는 내부함수가 외부함수의 맥락(context)에 접근할 수 있는 것을 가르킨다. 클로저는 자바스크립트를 이용한 고난이도의 테크닉을 구사하는데 필수적인 개념으로 활용된다. 내부함수 자바스크립트는 함수 안에서 또 다른 함수를 선언할 수 있다. 아래의 예제를 보자. 결과는 경고창에 coding everybody가 출력될 것이다. function outter() { function inner() { let title = "coding everybody"; console.log(title); } inner(); } outter(); 위의 예제에서 함수 outter의 내부에는 함수 inner가 정의 되어 있다. 함수 inner를 내부 함수라고 한다. 내부함수는 외부함수의 지역변수에 접근할 수 .. 2021. 7. 17.
값으로서의 함수와 콜백 값으로서의 함수와 콜백 function a(){} === let a =function (){} === let a = () => {} 위의 예제에서 함수 a는 변수 a에 담겨진 값이다. 또한 함수는 객체의 값으로 포함될 수 있다. 이렇게 객체의 속성 값으로 담겨진 함수를 메소드(method)라고 부른다. a = { b: function () {}, }; 함수는 값이기 때문에 다른 함수의 인자로 전달 될수도 있다. 아래 예제를 보자. function cal(func, num) { return func(num); } function increase(num) { return num + 1; } function decrease(num) { return num - 1; } alert(cal(increase, 1)).. 2021. 7. 17.
함수 유효범위 : 전역변수와 지역변수 함수 유효범위 : 전역변수와 지역변수 유효범위(Scope)는 변수의 수명을 의미한다. 아래의 예제를 보자. 결과는 global이다. var vscope = "global"; // 전역변수 global function fscope() { var vscope = "local"; // 지역변수 local // alert(vscope); // 'local' 함수내부위 vscope가 없을떄 "global" } let a = "sc"; console.log(a); // sc function fscope2() { // alert(vscope); // "global" var lv = "local variables"; a = "kk"; console.log(a); //kk } fscope(); fscope2(); con.. 2021. 7. 16.
상속, prototype 상속, prototype; const user = { name: "Mike", }; user.name; // "Mike" user.hasOwnProperty("name"); // true user.hasOwnProperty("age"); // false const user = { name: "Mike", hasOwnProperty: function () { console.log("haha"); }, }; user.hasOwnProperty(); // "haha" const car = { wheels: 4, drive() { console.log(drive); }, }; const bmw = { color: "red", navigation: 1, }; const benz = { color: "black",.. 2021. 7. 13.
call, apply, bind call, apply, bind 함수 호출방식과 관계없이 this를 지정할 수 있음 call call멧서드는 모든 함수에서 사용할 수 있으며, this를 특정값으로 지정할수 있습니다. const Mike = { name: "Mike", }; const Tom = { name: "Tom", }; function showThisName() { console.log(this.name); } showThisName.call(Mike); // Mike showThisName.call(Tom); // Tom function update(birthYear, occupation) { this.birthYear = birthYear; this.occupation = occupation; } update.call(Mike.. 2021. 7. 13.
setTimeout /setInterval setTimeout 일정 시간이 지난 후 함수를 실행 setInterval 일정 시간 간격으로 함수를 반복 function fn() { console.log(3); } setTimeout(fn, 3000); setTimeout(() => { console.log(3); }, 3000); const tid = function showName(name) { console.log(name); }; setTimeout(showName, 3000, "Mike"); clearTimeout(tid); // 3초가 지나기 전에 이 코드가 실행되어 아무것도 일어나지않는다 setInterval function showName(name) { console.log(name); } const tid = setInterval(s.. 2021. 7. 12.