JavaScript基础—闭包,事件
2016-01-30 00:00
651 查看
Js基础-闭包,事件
1:js中的闭包
概念:在一个函数内部又定义了一个函数,内部函数能访问到外部函数作用域范围内的变量,这时这个内部函数就叫做闭包,无论这个内部函数在哪里被调用都能访问到外部函数作用域中的那些变量。这些闭包是通过作用域链来实现的。
闭包可以做什么:
改变变量作用域;js中的面向对象都是用闭包来模拟的。
注意:当代码中有闭包的时候,闭包的代码什么时间执行最重要。
Eg:下面的代码相当于C#中的局部变量,外面是访问不到的。
<script type="text/javascript">
function Person(name) {
this.user_name = name;
var user_age = '23';
}
var p1 = new Person('阿辉');
alert(p1.user_age);
</script>
通过下面的demo可以实现外部的访问。
<script type="text/javascript">
function Person(name) {
this.user_name = name;
//通过这种方式可以模拟私有成员,类似于private成员。
var user_age = 23;
//this这里就类似于public成员
this.set_age = function(age) {
user_age = age;
};
this.get_age = function() {
return user_age;
};
}
var p1 = new Person('阿辉');
p1.set_age(100);
alert(p1.get_age());
</script>
Eg:实际中的闭包
这里相当于我们C#中的静态变量一样,下面的变量输出就是先在自己的作用域中找,接着在父类的作用域中招,接着在整个大的环境中找。最里面的作用域函数就是闭包。这是通过作用域链来实现的。优点:外层函数的变量都可以访问到。缺点:最里面的函数要是不释放,外层一直保存着,不释放。
var x = 100;
function fn1() {
var y = 101;
alert(y);
alert(x);
return function() {
var y = 99;
alert(y);
alert(x);
};
}
var fn2 = fn1();
fn2();
2:js中的this
这里的this大体上面和c#中的一样,只是我们是在js中药因地制宜。
下面的代码就是代表window.
<script type="text/javascript">
/*在一个函数内部,this表示是那个对象,取决于当前函数是那个对象的函数*/
function f1() {
alert(this);//这个this代表window对象
}
//直接在页面上面定义函数默认是注册给了window对象的,下面的f1(0和window.f1()等价
f1();
</script>
Js中的this代表谁,我们只需要看这个函数注册给了谁,要是没有注册是匿名函数,则是window中的this。
3:js中的事件
事件是最最重要的,因为在页面上就是这么写的。
以前在开发中经常会遇到页面的跳转,有时候又不跳转,我们在href="#"喜欢写#,这样做的坏处是页面会重新的回到顶部,我们可以使用js中的代码来写。
<a href="javascript:alert(void());">11</a>
这样子就不会重新的刷新页面了。这里在html中写的javascript:这是协议,是我们和浏览器之间约定好的规则。
事件就是为其添加Onclick事件。
<div>
<input onclick="alert(new Date().toLocaleString());" type="button" name="name" value="显示当前时间"/>
</div>
1:js中的闭包
概念:在一个函数内部又定义了一个函数,内部函数能访问到外部函数作用域范围内的变量,这时这个内部函数就叫做闭包,无论这个内部函数在哪里被调用都能访问到外部函数作用域中的那些变量。这些闭包是通过作用域链来实现的。
闭包可以做什么:
改变变量作用域;js中的面向对象都是用闭包来模拟的。
注意:当代码中有闭包的时候,闭包的代码什么时间执行最重要。
Eg:下面的代码相当于C#中的局部变量,外面是访问不到的。
<script type="text/javascript">
function Person(name) {
this.user_name = name;
var user_age = '23';
}
var p1 = new Person('阿辉');
alert(p1.user_age);
</script>
通过下面的demo可以实现外部的访问。
<script type="text/javascript">
function Person(name) {
this.user_name = name;
//通过这种方式可以模拟私有成员,类似于private成员。
var user_age = 23;
//this这里就类似于public成员
this.set_age = function(age) {
user_age = age;
};
this.get_age = function() {
return user_age;
};
}
var p1 = new Person('阿辉');
p1.set_age(100);
alert(p1.get_age());
</script>
Eg:实际中的闭包
这里相当于我们C#中的静态变量一样,下面的变量输出就是先在自己的作用域中找,接着在父类的作用域中招,接着在整个大的环境中找。最里面的作用域函数就是闭包。这是通过作用域链来实现的。优点:外层函数的变量都可以访问到。缺点:最里面的函数要是不释放,外层一直保存着,不释放。
var x = 100;
function fn1() {
var y = 101;
alert(y);
alert(x);
return function() {
var y = 99;
alert(y);
alert(x);
};
}
var fn2 = fn1();
fn2();
2:js中的this
这里的this大体上面和c#中的一样,只是我们是在js中药因地制宜。
下面的代码就是代表window.
<script type="text/javascript">
/*在一个函数内部,this表示是那个对象,取决于当前函数是那个对象的函数*/
function f1() {
alert(this);//这个this代表window对象
}
//直接在页面上面定义函数默认是注册给了window对象的,下面的f1(0和window.f1()等价
f1();
</script>
Js中的this代表谁,我们只需要看这个函数注册给了谁,要是没有注册是匿名函数,则是window中的this。
3:js中的事件
事件是最最重要的,因为在页面上就是这么写的。
以前在开发中经常会遇到页面的跳转,有时候又不跳转,我们在href="#"喜欢写#,这样做的坏处是页面会重新的回到顶部,我们可以使用js中的代码来写。
<a href="javascript:alert(void());">11</a>
这样子就不会重新的刷新页面了。这里在html中写的javascript:这是协议,是我们和浏览器之间约定好的规则。
事件就是为其添加Onclick事件。
<div>
<input onclick="alert(new Date().toLocaleString());" type="button" name="name" value="显示当前时间"/>
</div>
相关文章推荐
- JS的跳转
- JavaScript基础插曲—获取标签,插入元素,操作样式
- JavaScript
- js中的prototype和__proto__
- 旧知识的巩固,js多维数组的for定义,js自定义键值数组的定义
- 加入JavaScript 定时器开发俄罗斯方块模式的2048项目
- 双色球、大乐透、3D精选版!祝君好运(Javascript)
- js图片跑马灯效果
- JSP(三)JSTL表达式
- JavaScript世界的一等公民 - 函数
- JavaScript的定义及语法
- javascript的学习整理(二)
- javascript中的匀速运动(两种方式)
- JavaScript设计模式学习笔记2
- js阻止表单提交默认行为的两种方式
- JavaScript的学习整理(一)
- 使用Backbone将两个json对象合并到一个Collection对象中
- javascript实现减速运动
- javascript实现图片的淡入淡出
- javascript实现(分享到xxx)的小实例