Js基础-闭包,事件

1:js中的闭包

概念:在一个函数内部又定义了一个函数,内部函数能访问到外部函数作用域范围内的变量,这时这个内部函数就叫做闭包,无论这个内部函数在哪里被调用都能访问到外部函数作用域中的那些变量。这些闭包是通过作用域链来实现的。

闭包可以做什么:

改变变量作用域;js中的面向对象都是用闭包来模拟的。

注意:当代码中有闭包的时候,闭包的代码什么时间执行最重要。

Eg:下面的代码相当于C#中的局部变量,外面是访问不到的。

  1. <script type="text/javascript">
  2.     function Person(name) {
  3.         this.user_name = name;
  4.         var user_age = '23';
  5.     }
  6.     var p1 = new Person('阿辉');
  7.     alert(p1.user_age);
  8. </script>

通过下面的demo可以实现外部的访问。

  1. <script type="text/javascript">
  2.     function Person(name) {
  3.         this.user_name = name;
  4.         //通过这种方式可以模拟私有成员,类似于private成员。
  5.         var user_age = 23;
  6.         //this这里就类似于public成员
  7.         this.set_age = function(age) {
  8.             user_age = age;
  9.         };
  10.         this.get_age = function() {
  11.             return user_age;
  12.         };
  13.     }
  14.     var p1 = new Person('阿辉');
  15.     p1.set_age(100);
  16.     alert(p1.get_age());
  17. </script>

Eg:实际中的闭包

这里相当于我们C#中的静态变量一样,下面的变量输出就是先在自己的作用域中找,接着在父类的作用域中招,接着在整个大的环境中找。最里面的作用域函数就是闭包。这是通过作用域链来实现的。优点:外层函数的变量都可以访问到。缺点:最里面的函数要是不释放,外层一直保存着,不释放。

  1. var x = 100;
  2.  
  3. function fn1() {
  4.     var y = 101;
  5.     alert(y);
  6.     alert(x);
  7.     return function() {
  8.         var y = 99;
  9.         alert(y);
  10.         alert(x);
  11.     };
  12. }
  13. var fn2 = fn1();
  14. fn2();

2:js中的this

这里的this大体上面和c#中的一样,只是我们是在js中药因地制宜。

下面的代码就是代表window.

  1. <script type="text/javascript">
  2.     /*在一个函数内部,this表示是那个对象,取决于当前函数是那个对象的函数*/
  3.     function f1() {
  4.         alert(this);//这个this代表window对象
  5.     }
  6.     //直接在页面上面定义函数默认是注册给了window对象的,下面的f1(0和window.f1()等价
  7.     f1();
  8. </script>

 

Js中的this代表谁,我们只需要看这个函数注册给了谁,要是没有注册是匿名函数,则是window中的this。

3:js中的事件

事件是最最重要的,因为在页面上就是这么写的。

以前在开发中经常会遇到页面的跳转,有时候又不跳转,我们在href="#"喜欢写#,这样做的坏处是页面会重新的回到顶部,我们可以使用js中的代码来写。

  1. <a href="javascript:alert(void());">11</a>

这样子就不会重新的刷新页面了。这里在html中写的javascript:这是协议,是我们和浏览器之间约定好的规则。

事件就是为其添加Onclick事件。

  1. <div>
  2.     <input onclick="alert(new Date().toLocaleString());" type="button" name="name" value="显示当前时间"/>
  3. </div>

 

 

JavaScript基础—闭包,事件的更多相关文章

  1. JavaScript基础—dom,事件

    Js基础-DOM 1:dom:文档对象模型 Dom就是html页面的模型,将每个标签都作为一个对象,js通过调用dom中的属性,方法就可以对网页中的文本框,层等元素进行编程控制.Dom就是一些让jav ...

  2. javascript closure 闭包 事件绑定

    先来一个基本的例子 <!-- 实现一段脚本,使得点击对应链接alert出相应的编号 --> <meta http-equiv="Content-Type" con ...

  3. javascript基础-闭包

    原理 函数里包含函数,即闭包. 包含函数的结果是,子函数会挟持父函数的活动对象.子函数在访问一个变量时,先读自身的活动对象,是否包含此变量,没有从父函数里找,还没有,去祖函数,层层回溯,直到windo ...

  4. javascript基础:事件

    事件: 概念:某些组件被执行了某些操作后,触发某些代码的执行 *  事件:某些操作,如:单击,双击,键盘按下了,鼠标移动了 *  事件源:组件.如:按钮   文本输入框.... *  监听器:代码 * ...

  5. 深入理解JavaScript的闭包特性如何给循环中的对象添加事件

    初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数中(event handler)获取对应的索引.但每次获取的都是最后一次循环的索引.原因是初学者并未理解JavaScript ...

  6. javaScript基础之闭包

    不管是Jquery还是EXTJS,现代的js框架中大量应用了js的一些特性,比如:匿名函数,闭包等等,导致源代码非常难以阅读. 不过要想真正的使用好前台的UI技术,还是需要去深入的理解这些概念.   ...

  7. 如何给循环中的对象添加事件--深入理解JavaScript的闭包特性

    初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数中(event handler)获取对应的索引.但每次获取的都是最后一次循环的索引.原因是初学者并未理解JavaScript ...

  8. 深入理解JavaScript的闭包特性 如何给循环中的对象添加事件(转载)

    原文参考:http://blog.csdn.net/gaoshanwudi/article/details/7355794 初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数 ...

  9. JavaScript的闭包特性如何给循环中的对象添加事件(一)

    初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数中(event handler)获取对应的索引.但每次获取的都是最后一次循环的索引.原因是初学者并未理解JavaScript ...

随机推荐

  1. [WPF实用技巧]如何使WPF的TreeView节点之间有连线

    示例代码:TreeViewEx.zip 原文地址:http://www.codeproject.com/Tips/673071/WPF-TreeView-with-WinForms-Style-Fom ...

  2. 一步一步跟我学DeviceOne开发 - 仿微信应用(一,二,三)

    这是一个系列的文档,长期目标是利用DeviceOne开发一些目前使用广泛的优质手机应用,我们会最大化的实现这些应用的每一个功能和细节,不只停留在简单的UI模仿和Demo阶段,而是一个基本可以使用的实际 ...

  3. linux expect详解(ssh自动登录)

    shell脚本实现ssh自动登录远程服务器示例: #!/usr/bin/expect spawn ssh root@192.168.22.194 expect "*password:&quo ...

  4. 实战使用Axure设计App,使用WebStorm开发(1) – 用Axure描述需求

    系列文章 实战使用Axure设计App,使用WebStorm开发(1) – 用Axure描述需求  实战使用Axure设计App,使用WebStorm开发(2) – 创建 Ionic 项目   实战使 ...

  5. C# Azure 存储-分布式缓存Redis的新建&配置&查看

    1. 介绍 Redis 是一款开源的,基于 BSD 许可的,高级键值 (key-value) 缓存 (cache) 和存储 (store) 系统.由于 Redis 的键包括 string,hash,l ...

  6. Java框架介绍-13个不容错过的框架项目

    本文转自互联网,个人收藏所用. 下面,我们将一同分享各有趣且颇为实用的Java库,大家请任取所需.不用客气~ 1.极致精简的Java Bootique是一项用于构建无容器可运行Java应用的极简技术. ...

  7. iOS UITableView行高自行扩展

    myTableView.estimatedRowHeight = ; myTableView.rowHeight = UITableViewAutomaticDimension; 不需要实现 - (C ...

  8. 如何把IP转换成经纬度(Java版)

    经常有这种需求,拥有用户的IP地址,想要在地图上显示用户的访问量.这个时候就需要用到经纬度...应为一般的地图插件都是基于经纬度的. 那么问题来了,如何把IP转换成经纬度? 百度API 最国产的方式, ...

  9. Android开发小问题总结

    Android开发遇到的小问题之小解: ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ...

  10. 将图片的二进制字节 在HTML页面中显示

    两种方法: 后端的一般处理程序:Imge.ashx using System; using System.Collections.Generic; using System.Linq; using S ...