js中匿名函数
今天碰到一道题,里面既包含了匿名函数的知识,也包含了预编译,函数的传参(形参),感觉迷迷糊糊的,所以想着做个总结。
var foo={n:1};
(function(foo){
console.log(foo.n);
foo.n=3;
var foo={n:2};
console.log(foo.n);
})(foo);
console.log(foo.n);
上面的代码,可以写成这样,看解释
var foo={n:1};
(function(foo){ //此时形参和实参指向相同的内存空间,且空间的值n为1
var foo; //变量的提升,一个变量的声明优先级低于形参,so这行相当于无效
console.log(foo.n); //这里应当输出1
foo.n=3; //形参和实参的指向的内存空间发生了改变,值现在变为3
var foo={n:2}; //这行很关键,开辟了新的内存空间,n的值为2
console.log(foo.n); //由于js中的代码是自上而下执行,所以此时输出2
})(foo);
console.log(foo.n); //之前的内存空间值为3,所以输出3
结果输出 1 2 3
按照上面的思路,如果第五行和第六行换一下呢
var foo={n:1};
(function(foo){ //此时形参和实参指向相同的内存空间,且空间的值n为1
var foo; //变量的提升,一个变量的声明优先级低于形参,so这行相当于无效
console.log(foo.n); //这里应当输出1
var foo={n:2}; //这行很关键,开辟了新的内存空间和之前的已经断开联系,n的值为2
foo.n=3; //改变了新的内存空间里面的值,值现在变为3
console.log(foo.n); //由于js中的代码是自上而下执行,所以此时输出3
})(foo);
console.log(foo.n); //之前的内存空间值为1,所以输出1
结果输出 1 3 1
ok 那接下来这个呢
var foo={n:1};
(function(foo){ //此时形参和实参指向相同的内存空间,且空间的值n为1
var foo; //变量的提升,一个变量的声明优先级低于形参,so这行相当于无效
console.log(foo.n); //这里应当输出1
foo.n=3; //形参和实参的指向的内存空间发生了改变,值现在变为3
foo.n=2 //并没有开辟了新的内存空间,在原来的基础上修改的,n的值为2
console.log(foo.n); //由于js中的代码是自上而下执行,所以此时输出2
})(foo);
console.log(foo.n); //原始的的内存空间值经过修改变为2,所以输出2
结果输出 1 2 2
下面和上面一样了
var foo={n:1};
(function(foo){ //此时形参和实参指向相同的内存空间,且空间的值n为1
var foo; //变量的提升,一个变量的声明优先级低于形参,so这行相当于无效
console.log(foo.n); //这里应当输出1
foo.n=2; //形参和实参的指向的内存空间发生了改变,值现在变为2
foo.n=3; //并没有开辟了新的内存空间,在原来的基础上修改的,n的值为3
console.log(foo.n); //由于js中的代码是自上而下执行,所以此时输出3
})(foo);
console.log(foo.n); //原始的内存空间的值经过修改变为3,所以输出3
结果输出 1 3 3
那下面这个呢(第五行和第六行都改变了指向,由于并不是在原来的基础上修改的,所以最后输入的值不变)
var foo={n:1};
(function(foo){ //此时形参和实参指向相同的内存空间,且空间的值n为1
var foo; //变量的提升,一个变量的声明优先级低于形参,so这行相当于无效
console.log(foo.n); //这里应当输出1
var foo={n:2}; //开辟了新的内存空间,n的值为2
var foo={n:3}; //开辟了新的内存空间,n的值为3
console.log(foo.n); //由于js中的代码是自上而下执行,所以此时输出3
})(foo);
console.log(foo.n); //原始的内存空间的值为1,并没被有被修改,所以输出1
结果输出 1 3 1
这个就和上面的一样了
var foo={n:1};
(function(foo){ //此时形参和实参指向相同的内存空间,且空间的值n为1
var foo; //变量的提升,一个变量的声明优先级低于形参,so这行相当于无效
console.log(foo.n); //这里应当输出1
var foo={n:3}; //开辟了新的内存空间,n的值为3
var foo={n:2}; //开辟了新的内存空间,n的值为2
console.log(foo.n); //由于js中的代码是自上而下执行,所以此时输出2
})(foo);
console.log(foo.n); //原始的内存空间并未被修改,所以输出1
结果输出 1 2 1
以上为小弟解读,如果过错还请大神指教。
js中匿名函数的更多相关文章
- JS中匿名函数$(function(){ })和(function(){})()的区别
“$(function(){ });” Jquery语法的匿名函数,用于存放操作DOM对象的代码,执行其中代码时DOM对象已存在: (通过这样就可以在页面加载完成时通过ajax再异步加载一些数据) “ ...
- 总结下js中匿名函数的写法~好几天没写博客了。。。
小哥最近很是心烦啊,不仅仅要继续以现任前端小白,未来前端攻城狮的身份苦逼学习,还要用剩余的时间去完成毕业设计.早知如此,当初我为毛要报考数学这么个苦逼专业....昨天一整天的时间在研究毕设,感觉代码已 ...
- js中匿名函数和回调函数
匿名函数: 通过这种方式定义的函数:(没有名字的函数) 作用:当它不被赋值给变量单独使用的时候 1.将匿名函数作为参数传递给其他函数 2.定义某个匿名函数来执行某些一次性任务 var f = func ...
- js中匿名函数的N种写法
匿名函数没有实际名字,也没有指针,怎么执行? 关于匿名函数写法,很发散~ +号是让函数声明转换为函数表达式.汇总一下 最常见的用法: 代码如下: (function() { alert('water ...
- js中的函数,Date对象,Math对象和数组对象
函数就是完成某个功能的一组语句,js中的函数由关键字 function + 函数名 + 一组参数定义;函数在定义后可以被重复调用,通常将常用的功能写成一个函数,利用函数可以使代码的组织结构更多清晰. ...
- JS中的函数、Bom、DOM及JS事件
本期博主给大家带来JS的函数.Bom.DOM操作,以及JS各种常用的数据类型的相关知识,同时,这也是JavaScript极其重要的部分,博主将详细介绍各种属性的用法和方法. 一.JS中的函数 [函数的 ...
- node.js 中回调函数callback(转载),说的很清楚,看一遍就理解了
最近在看 express,满眼看去,到处是以函数作为参数的回调函数的使用.如果这个概念理解不了,nodejs.express 的代码就会看得一塌糊涂.比如: 复制代码 代码如下: app.use(fu ...
- JS中的函数、BOM和DOM操作
一.JS中的函数 [关于注释] /** [文档注释]:开头两个*.写在函数上方,在调用函数时可以看到文档上方的描述信息. */ // 单行注释 /* 多行注释 */ 1.函数的声明及调用 (1) ...
- html css <input> javaScript .数据类型 JS中的函数编写方式 BOM总结 DOM总结
Day27 html css div 块标签. 特点: 独占一行,有高度和宽度 span 行元素. 特点:在同一行显示,当前行满了自动去下一行显示. 不识别高度和宽度 1.1.1.1 2.输入域标签 ...
随机推荐
- 关于locals()、globals()以及作用域的一些感悟
示例代码 i=6def foo(): print locals() print globals() i=66 print locals() print globals()class demo: i=6 ...
- 禅道SQA
背景 近期以项目质量和测试管理的角色介入了一个大型的项目中间,项目的业务测试方面重点在节点把控和风险跟进. 以往进行测试进度展示是通过bug解决进度及整体走势图来进行体现,这块手工作图太过麻烦,干脆整 ...
- 计算幂 51Nod 1046 A^B Mod C
给出3个正整数A B C,求A^B Mod C. 例如,3 5 8,3^5 Mod 8 = 3. Input 3个正整数A B C,中间用空格分隔.(1 <= A,B,C <= 10^ ...
- java.net.UnknownHostException 异常解决方案
1)使用hostname命令设置新的host name与/etc/hosts本机hostname一致 #hostname 本机hostname 具体可以查看:/etc/hosts和//etc/sysc ...
- 设计模式--单例模式(Singleton pattern)及应用
单例模式 参考文档: 该文仅介绍spring的单例模式:spring 的单例模式 介绍原理:Spring的单例模式底层实现 参考书籍:漫谈设计模式:从面向对象开始-刘济华.pdf 1. 单例模式解析 ...
- UVA - 1639 -Candy
题目链接:https://vjudge.net/problem/UVA-1639 题目大意: 有两个糖果盒,每个盒子里面有n个糖果,每天随机选一个(概率分别为p,1-p),然后吃一颗糖.直到有一天,打 ...
- OP查阅网站
1)http://www.zhdba.com/mysqlops/ 2)
- ueditor编辑器使用总结
ueditor使用小结 一.简介 ueditor是百度编辑器,官网地址:http://ueditor.baidu.com/website/ 完整的功能演示,可以参考:http://ueditor.ba ...
- 浅谈js分页的几种方法
一个项目中必然会遇到分页这种需求的,分页可以使数据加载更合理,也让页面显示更美观,更有层次感!那么js分页到底如何实现呢?下面我就来讲一下三种循序渐进的方法 1.自己纯手写分页 更深入的去理解分页的意 ...
- JSP和El表达式和JSTL标签库使用
核心标签库: <%@ page language="java" import="java.util.*" pageEncoding="utf-8 ...