javascript 闭包

达达前端

发布于 2019-07-15 11:04:50

4130

发布于 2019-07-15 11:04:50

文章被收录于专栏：达达前端达达前端达达前端

如果没有实战经验，你很难从定义去理解它

最简单最原始的闭包demo

javascript 代码

function A() {
 function B() {
  console.log("Hello");
 }
 return B;
}

var c = A();

c(); // Hello

在A中返回B的引用如果一个对象不再被引用，那么这个对象就会被GC回收，否则这个对象一直会保存在内存中。

function A() {
 var count = 0;
 function B() {
  count ++;
  console.log(count);
 }
 return B;
}
var c = A();
c(); // 1
c(); // 2

A中的count一直保存在内存中

一个简单的demo组件：

(function(document) {
 var viewport;
 var obj = {
  init: function(id) {
   viewport = document.querySelector("#" + id);
  },
  addChild: function(child) {
   viewport.appendChild(child);
 },
 removeChild: function(child) {
  viewprot.removeChild(child);
 }
 }
 window.jView = obj;
})(document);

var f = function(document) {
 var viewport;
 var obj = {
  init: function(id) {
   viewport = document.querySelector("#"+id);
  },
  addChild: function(child) {
  viewport.appendChild(child);
  },
  removeChild: function(child) {
  viewport.removeChild(child);
  }
 }
 window.jView = obj;
};
f(document);

JS的执行环境(execution context)、活动对象(activation object)以及作用域(scope)和作用域链(scope chain)的运行机制

本文参与腾讯云自媒体分享计划，分享自作者个人站点/博客。

原始发表：2019.07.13 ，如有侵权请联系 cloudcommunity@tencent.com 删除

javascript