开心菜鸟系列－－－－函数作用域（javascript入门篇）
1 <!DOCTYPE html>
2 <html>
3 <script src="./jquery-1.7.2.js"></script>
4 <head>
5 <title></title>
6 </head>
7 <body>
8 <input type="text" name="type" id="type" value="songxuxua"/>
9 <span id="hah"></span>
10 <a href="javascript:void(0);" >ssssssssssss</a>
11 </body>
12 <script>
13 /**
14 * @type 开心菜鸟系列－－－－作用域（javascript入门篇）
15 * @introduce {string}
16 * @author {string} 开心菜鸟
17 */
18
19 /**
20 * 书接上文啊,上一节我们谈了全局变量,
21 * 但是我看了,看的人很少啊,可能太简单了,没办法水平就这么高,毕竟不是专业做js的.
22 * 本来吧,想这周内接着写的,但是由于我离职了,要做交接工作啊,虽然在公司里是酱油级别的人物,
23 * 但是我这个人,做事比较认真,bug能不改就不改,改了,就要改好,即使最后时刻,下午写了三篇doc文档,
24 * 结束了我8个月的phper过渡期.
25 * 闲话少说了,在这里说这些,其实就是想少开个贴子,呵呵
26 */
27 //还要说一下全局变量,有一点拉下了,最近又碰到了,分享给大家,
28 //猜猜我是谁,
29 //错误用法@2,我们在ie8以下,看看屌丝的代码,2013/11.8日 晚发现的这个,由于我平时保持规范,遇不到.
30 console.info(type);
31 console.info(hah);
32 //这个东西真有意思啊,第一次遇到,也是在写博客的时候,自己测试遇到的,
33 //他把dom的id全都生成全局变量了,但是在ie7以下啊,他只是一个object,并不是一个元素对象,试试喽
34 function test()
35 {
36 //错误用法@1
37 var name = abc = 'songxiuxuan';
38 data = 'songxiuxun';
39 }
40 test(); //注释和不注释啊
41 //大家猜猜这是什么啊.
42 console.info(abc) //这是什么啊土豪
43 //解释一下,ie对一些js的语法要求比较严格,由于我不是专业写js的,所以就不列举了,只是列举出我们实例碰到的.
44 //age是一个全局变量,但是ie认为你age并没有声明啊,我赋于一个没有声明的变量,他就会报错.
45 //这里有一个知识点,上一章并没有提到的,当声明变量的时候,
46 // 如果没有用var去声明的话,那么我们就认为他是window.变量的一个属性,而ie8以下对声明变量解析和其它浏览器器不同的.
47 // 这样会污染全局变量的.
48
49 //弥补了全局变量写的不足,下面我们开始,今天的主题,作用域,在js中是虾米鸟东东.
50 //我想说的是,我写的东西没有理论,只有例子,因为理论没用啊.
51 //其实作用域,这个东西在js中非常重要,只是你平时不注意而已
52 //在产生作用域之前,我们先理一下,先要进入上下文,然后执行上下文,之后就会产生了作用域,至于这个是全局的还是局部的,
53 //要看具体的代码喽,其实就是caller调用了calle,把控制权交给了calle,caller等待,在交给calle的时候就产生了作用域,叫函数作用域.
54 //今天我们主要讲函数作用域,可能会带着点闭包,
55 //首先作用域是静态的?
56 function statciScope()
57 {
58 //也声明一个局部变量
59 var weiwu = 'hahahh';
60 console.info(weiwu);
61 }
62 function callerStatic()
63 {
64 var weiwu = 'songxiuxuan'//声明一个局部变量
65 statciScope();
66 }
67 callerStatic(); //hahaha
68 //继续,
69 //传说this是变动的,当然,今天我们不谈.
70 function thisSocpe()
71 {
72 this.socpe = 'this is this';
73 console.info(this.socpe);
74 }
75 function callerThis()
76 {
77 this.socpe = 'caller'
78 new thisSocpe();
79 }
80 //ok连传说中的this都没有指向调用他的,我们证明了作用域是静态的.
81 new (callerThis)
82 //深入作用域
83 function goToScope(a,b,c)
84 {
85 var parentVar = 'this is parent';
86 return function () {
87 console.info(a,b,c,parentVar); //看一看输出了什么啊
88 }
89 }
90 //证明了,作用域是从caller调用了calle进入上下文到执行函数上下文,到底发生了什么啊
91 //当进行上下文时,就会函数的创建了一个scope的属性,也就是函数创建阶段
92 //当caller去调用calle,就执行了这个函数,也就是执行这个上下文,而函数的形参是第一个存入到scope作用域中,
93 //然后会把函数内的局部变量也放入到作用域中,
94 //当这个函数发生闭包,这个作用域在函数内部就相当于全局的,也就是说他也有一个属性,指向这个函数,而里面的函数又有一层作用域,
95 //但是由于闭包函数的上一层作用域对他来说是静止的.会出现下一层改变上一层作用域的属性,会一直保存
96 //其实大家可能想不明白,我就说直接一点吧,window是什么啊,是在浏览器下javascript的里大的一层作用域 ,
97 //而nodejs里最大的变量作用是global,这个只是js底层给我们封装好的一个变量,我们是在一个全局的空间里写东西,
98 //那么就会产生层级之前关系,层级关系的链接就是作用域相连接,这样,每新产生一个作用域,我们完全可以把它想像成新开辟一个window的全局对象
99 //只不过这个全局对象,是指对于他的子层来讲.
100 //因为有了这个作用域,我们就可以在子层调用上层的变量.我们下次进行调用子层的时候,上次修改了上层的作用域属性,还存在,
101 //以前我一直不理解,但是js就是这样,只要一个页面不刷新,一个变量增加会保存的,这个和函数作用域是一样的.
102
103 goToScope(20,30,40)();
104
105 //还有一点需要补充,就是我们要调用一个变量时,我们会从作用,向上去查找,直到找到这个变量,
106 //如果在函数作用域找不到这个变更,我们就会在原型链上去寻找
107
108 function Abc()
109 {
110 // this.name = 'songxiuxuan';//打开我
111 this.getName = function () {
112 }
113 }
114 //Abc.prototype.name = 'wo jiao kaixin feida de kaixin';//打开我
115 Abc.prototype.setName = function () {
116 console.info('aaa');
117 }
118 function Child()
119 {
120 // this.name = 'heiheihei'; //打开我
121 this.getHeihei = function () {
122 console.info(this.name);
123 }
124 }
125 Child.prototype.heihei = function () {
126 return function () {
127 console.info(this.name)
128 }
129 }
130 Child.prototype = new Abc();
131 c = new Child();
132 //把name的挨个打个,试试一下,呵呵 结束了.
133 c.getHeihei();
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148 </script>
149 </html>
开心菜鸟系列－－－－函数作用域（javascript入门篇）的更多相关文章
- 开心菜鸟系列－－－－变量的解读（javascript入门篇）
console.info( console.info(window['weiwu']) console.info(window. ...
- JavaScript入门篇 编程练习
编程挑战 一.定义"改变颜色"的函数 提示: obj.style.color obj.style.backgroundColor 二.定义"改变宽高"的函数 提 ...
- 慕课网JavaScript入门篇课程笔记
1.js注释很重要 单行注释,在注释内容前加符号 “//”. <script type="text/javascript"> document.write(" ...
- JavaScript入门篇
记录一下在慕课网学习JavaScript的过程. 以下内容均来自慕课网. 传送:https://www.imooc.com/code/401 为什么学习JavaScript 1. 所有主流浏览器都支持 ...
- Dubbo3 源码系列 Dubbo“纠葛”（入门篇）
日期 更新说明 2022年5月28日 spring xml部分解读 2022年6月3日 spring annotation部分解读 人生不相见, 动如参与商. 今夕复何夕, 共此灯烛光. 少壮能几时, ...
- JavaScript入门篇QA总结
Q1:JS可以放在哪个位置?A1:1.放在<head>标签中,用<script type="text/javascript"></script> ...
- JavaScript入门篇 第二天（消息对话框+网页弹出）
提问(prompt 消息对话框) prompt弹出消息对话框,通常用于询问一些需要与用户交互的信息.弹出消息对话框(包含一个确定按钮.取消按钮与一个文本输入框). 语法: prompt(str1, s ...
- JavaScript入门篇 第一天
使用<script>标签在HTML网页中插入JavaScript代码.注意, <script>标签要成对出现,并把JavaScript代码写在<script>< ...
- 二、JavaScript语言--JS基础--JavaScript入门篇
1.如何插入JS 使用<script>标签在HTML网页中插入JavaScript代码.注意, <script>标签要成对出现,并把JavaScript代码写在<scri ...
随机推荐
- 如何用js检测手机是否安装某个app
问题描述 如果本地安装了app那么直接打开,否则苹果要跳转到app-store,安卓则要跳到对应的市场 解决方案 一 //html代码中 的 a 标签,以微信为例,默认的是调用weixin schem ...
- MFC消息映射与命令传递
题外话:刚开始学视窗程序设计的时候,我就打印了一本Windows消息详解,里面列举了各种已定义消息的意义和作用,共10多页,在编程的时候翻翻,有时觉得很受用.我发觉很多编程的朋友,虽然每天都面对消息, ...
- ELK 下载地址elastic
lasticsearch 2.3.5 Elasticsearch can also be installed from our repositories using apt or yum. See R ...
- TestNG基本注解(注释)
传统的方式来表示JUnit3中的测试方法是测试自己的名字前缀.标记一个类中的某些方法,具有特殊的意义,这是一个非常有效的方法,但命名不很好的扩展(如果我们想添加更多标签为不同的框架?),而非缺乏灵活性 ...
- 40 个超棒的免费 Bootstrap HTML5 网站模板
Bootstrap 是快速开发Web应用程序的前端工具包.它是一个CSS和HTML的集合,它使用了最新的浏览器技术,给你的Web开发提供了时尚的版式,表单,buttons,表格,网格系统等等. 目前 ...
- opencv视频跟踪2
在前面的报告中我们实现了用SURF算法计算目标在移动摄像机拍摄到的视频中的位置.由于摄像机本身像素的限制,加之算法处理时间会随着图像质量的提高而提高,实际实验发现在背景复杂的情况下,结果偏差可能会很大 ...
- day55
担心了好久的编译原理也总是考完了 大学里的最后一次考试也是结束罗 这次的考试起伏跌宕啊 我们本来是9点钟开始考试 但是我们班的几个同学基本上7点钟就去了 为了什么?? 选个好的位置撒哈哈,到了九点,老 ...
- hcharts
折线图 http://www.hcharts.cn/demo/index.php?p=10 饼状图 http://higrid.net/docs/highcharts_cn/#plotOptions- ...
- 20 个非常棒的jQuery内容滑动插件
Wow Slider WOW Slider是一款小巧易用的网页滑块设计.该软件内置大量的模版和工具,让你轻松设计出完美的视觉效果.他还可以帮助用户在短时间内创造出梦幻般的滑块,而无需编码和图像编辑, ...
- MySQL具体解释（7）-----------MySQL线程池总结(一)
线程池是Mysql5.6的一个核心功能.对于server应用而言,不管是web应用服务还是DB服务,高并发请求始终是一个绕不开的话题.当有大量请求并发訪问时,一定伴随着资源的不断创建和释放.导致资源利 ...