JavaScript闭包

定义:闭包指一个拥有许多变量和绑定这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分。

    function a(){
var i=0;
function b(){
i++;
alert(i);
}
return b;
}
var c=a();
c();//弹出 1
c();//弹出 2

函数特点:

  1. 函数b嵌套在函数a内部;
  2. 函数a返回函数b。

当执行var c=a()后,变量c实际上就指向了函数b,再执行c()后就会弹出窗口显示的值。

当函数a的内部函数b被函数a外的一个变量引用的时候,就创建了一个闭包。

闭包就是能够读取其他函数内部变量的函数,本质上闭包就是将函数内部和函数外部连接起来的一座桥梁,而非内部能访问外部、外部不能访问内部。

作用:就是在a执行完后,闭包使得函数a不会释放,因为a的内部函数b的执行需要依赖a的变量。也就使得上述例子中,a中的i一直存在,每次执行c(),i都是自加1后的值。

    //模拟私有变量
function Counter(start){
//父函数Counter当做对象使用
var count=start;
return{
sum: function(){
count++;
},
get: function(){
return count;
}
}
} var fn1=Counter(4);
fn1.sum();
console.log(fn1.get());//打印值为 5

在这里,Counter函数返回两个闭包,函数sum和函数get。这两个函数都维持着对外部作用域Counter的引用,因此可以访问作用域内定义的变量count。

基础应用场景:

  1. 保护函数内的变量安全(以第一个函数为例,函数a中i只有函数b能访问,无法通过其他途径访问到,因此保护了i的安全性);
  2. 在内存中维持一个变量(依然如第一个为例,由于闭包,函数a中i一直存在于内存中,因此每次执行c()都会给i加1)。

判断下面的代码执行完成的结果可以帮助更好理解闭包:

    var name="The Window";
var object={
name: "My Object",
getNameFunc: function(){
return function(){
return this.name;
};
}
};
alert(object.getNameFunc()());//弹出 The Window
    var name="The Window";
var object={
name: "My Object",
getNameFunc: function(){
var that=this;
return function(){
return that.name;
};
}
};
alert(object.getNameFunc()());//弹出 My Object

在for循环中使用闭包

表示方法()()

第二个括号里传变量,第一个括号通过一个匿名函数接收第二个括号传递的变量,然后就隐形的定义了一个私有的(局部)变量。

    for(var i=0;i<10;i++){
(function(w){
setTimeout(function(){
console.log(w);
},1000)
})(i);
}
    //这个函数的效果和上面一样
for(var i=0;i<10;i++){
setTimeout((function(e){
return function(){
return console.log(e);
}
})(i),1000)
}

在上述例子中,外部的匿名函数会立即执行,并把i作为它的参数,此时函数内w变量就拥有了i的一个拷贝。当传递给setTimeout的匿名函数执行时,它就拥有了对w的引用,而这个值是不会被循环改变的。

闭包传递的变量接收后不会被释放,一直占用内存(不建议使用)

    <div class="divclosure">
<button>按钮1</button>
<butto 大专栏  JavaScript闭包、Object对象n>按钮2</button>
<button>按钮3</button>
<button>按钮4</button>
<button>按钮5</button>
</div>
<script>
var btns=document.querySelectorAll(".divclosure button");
for(var i=0;i<btns.length;i++){
btns[i].style.width=80+"px";
btns[i].style.height=45+"px";
btns[i].style.borderRadius=10+"px";
btns[i].style.marginRight=10+"px";
(function(w){
btns[w].onclick=function(){
alert(w);
}
})(i);
}
</script>
按钮1按钮2按钮3按钮4按钮5

Object对象

1.第一种方法

    <script>
//object
var person=new Object();
//属性
person.finger=10;
person.name="人";
person.age=23;
//方法
person.sayHello=function(){
document.write("你好,我叫"+this.name+";");
}
person.sayAge=function(){
document.write("我今年"+this.age+"岁;");
}
person.studyAge=function(study,dream){
document.write("我"+study+"开始上学的,我希望成为"+dream+";")
}
var xiaoming=new Object();
xiaoming.name="小明";
xiaoming.age="23";
person.sayHello();
person.sayAge();
person.sayHello.call(xiaoming);
person.sayAge.call(xiaoming);
person.studyAge.call(xiaoming,6,"科学家");
person.studyAge.apply(xiaoming,[6,"科学家"])
</script>

call方法:

改变方法里面的this的指向,方法使用的是原对象的,通过this获得的数据都是call的对象的;也就是调用一个对象的一个方法,以另一个对象替换当前对象。

function call(obj,[param1[,param2[,…[,paramN]]]])

obj:这个对象将代替function类里this对象

params:这个是一个参数列表

apply方法:

与call方法意思一样,参数列表不同;也就是调用一个对象的一个方法,以另一个对象替换当前对象。

function.apply(obj,args)方法能接收两个参数

obj:这个对象将代替Function类里this对象

args:这个是数组,它将作为参数传给function(args–>arguments)

JavaScript闭包、Object对象的更多相关文章

  1. javascript ES5 Object对象

    原文:http://javascript.ruanyifeng.com/stdlib/object.html 目录 概述 Object对象的方法 Object() Object.keys(),Obje ...

  2. JavaScript之Object对象常用属性与方法手册

    MDN Object参考地址:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Obje ...

  3. javascript的Object对象的defineProperty和defineProperties

    Object的属性 查看官网:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Obje ...

  4. javascript 遍历object对象

    (function(){ var str = ''; for(var i in obj){ //遍历object str += '\n'+(i+' : '+obj[i]); // i+' : '+ob ...

  5. JavaScript笔记 - Object对象特性的应用

    可以依据js对象中key是永远不会重复的原则,来模拟Map类型以及去除数组重复项. 1.模拟Map类型 (1)构造Map对象 function Map(){ //private var obj = { ...

  6. JavaScript:对Object对象的一些常用操作总结

    JavaScript对Object对象的一些常用操作总结. 一.Object.assign() 1.可以用作对象的复制 var obj = { a: 1 }; var copy = Object.as ...

  7. 关于javascript闭包中的this对象

    我们知道, this对象是运行时基于函数的执行环境绑定的:在全局函数中,this等于window,而当函数被作为某个对象的方法调用时,this等于那个对象.<Javascript高级程序设计&g ...

  8. JavaScript【5】高级特性(作用域、闭包、对象)

    笔记来自<Node.js开发指南>BYVoid编著 1.作用域 if (true) { var somevar = 'value'; } console.log(somevar); Jav ...

  9. javascript闭包和this对象

    闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. 一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域 ...

随机推荐

  1. tensorflow实现卷积层的几种方式

    #coding:utf-8 #第一种实现 tf.nn import tensorflow as tf import tensorflow.contrib.slim as slim tf.reset_d ...

  2. python-day2爬虫基础之爬虫基本架构

    今天主要学习了爬虫的基本架构,下边做一下总结: 1.首先要有一个爬虫调度端,来启动爬虫.停止爬虫或者是监视爬虫的运行情况,在爬虫程序中有三个模块,首先是URL管理器来对将要爬取的URL以及爬取过的UR ...

  3. 蓝桥杯 Car的旅行路线 (预处理+最短路径)

    https://www.luogu.org/problem/P1027 题目描述 又到暑假了,住在城市A的Car想和朋友一起去城市B旅游.她知道每个城市都有4个飞机场,分别位于一个矩形的4个顶点上,同 ...

  4. IMX6开发板虚拟机加载Ubuntu12.04.2镜像

    基于迅为IMX6开发板安装好虚拟机之后,用户就可以加载 Ubuntu12.04.2 镜像.用户可以在网盘中下载“编译好的镜像”,该镜像已经安装好了编译 Android4.4.2 所需要的大部分软件.用 ...

  5. k8s miniKube 入门

    k8s miniKube 入门 miniKube 是单机版kubernetes, 可以配置运行在同一台主机上的服务和pod,并使用docker作为虚拟化工具 下载:直接下载可执行文件,复制到path ...

  6. 关于XML的一些总结

    xml的知识结构图 eXtensible Markup Language,可扩展标记语言,简称XML,和HTML比较而言,语法相似,作用不同 XML被设计用来存储和传输数据,但存储数据方面,数据库是主 ...

  7. ZJNU 1138 - 小兔的棋盘——中级

    二维图的动态规划因为不能穿越对角线,则选取对角线的一边dp即可选取对角线右下侧则x轴上每个点只能由其左侧的点走过去(只有1条)对角线上的点只能由对角线下方的点走过去其他点可以由左侧和下侧两种方式到达因 ...

  8. 再来看看Java8的新特征——lambda表达式

    什么是lambda表达式? 可以把Lambda表达式理解为简洁地表示可传递的匿名函数的一种方式:它没有名称,但它有参数列表.函数主体.返回类型,可能还有一个可以抛出的异常列表. 比如说new一个Thr ...

  9. zabbix server in not running

    修改配置文件 vi zabbix.conf.php 修改lochlhost为 自己服务器的IP地址 修改$DB['SERVER']   = '192.168.30.6'; 修改$ZBX_SERVER  ...

  10. 看了这个Java实习生入职测试题后,幸亏我不是实习生

    看了这个Java实习生入职测试题后,幸亏我不是实习生 一个Java实习生的入职测试题,你能答对几个? 今天在某APP中看到,有实习生放出的Java实习生入职测试题.看完之后,很庆幸自己不是实习生. 本 ...