javascript函数中的三个技巧【一】
在学习javascript中,函数是非常重要的,现在我来谈谈对函数的理解以及在工作和用法中的一些技巧
技巧一、
【作用域安全的构造函数】
构造函数其实就是一个使用new操作调用的函数
function Person(name,age,job){
this.name=name;
this.age=age;
this.job=job;
}
var person=new Person('match',28,'Software Engineer');
console.log(person.name);//match
如果没有new操作,原本针对Person对象的三个属性被添加到window对象中去
function Person(name,age,job){
this.name=name;
this.age=age;
this.job=job;
}
var person=Person('match',28,'Software Engineer');
console.log(person);//undefined
console.log(window.name);//match
如上代码所示,直接的person是一个undefined,然而Person中的属性都添加到window对象中
window的name属性是用来标识链接目标和框架的,这里对该属性的偶然覆盖可能会导致页面上的其他错误,这个问题的解决方式就是创建一个作用域安全的构造函数
function Person(name,age,job){
if(this instanceof Person){
this.name=name;
this.age=age;
this.job=job;
}else{
return new Person(name,age,job);
}
}
var person=Person('match',28,'Software Engineer');
console.log(window.name); // ""
console.log(person.name); //'match'
var person= new Person('match',28,'Software Engineer');
console.log(window.name); // ""
console.log(person.name); //'match'
但是对构造函数窃取模式的继承,会带来副作用,这是因为,下列代码中,this对象并非Polygon对象实例,所以构造函数Polygon()会创建一并返回一个新的实例
function Polygon(sides){
if(this instanceof Polygon){
this.sides=sides;
this.getArea=function(){
return 0;
}
}else{
return new Polygon(sides);
}
}
function Rectangle(wifth,height){
Polygon.call(this,2);
this.width=this.width;
this.height=height;
this.getArea=function(){
return this.width * this.height;
};
}
var rect= new Rectangle(5,10);
console.log(rect.sides); //undefined
如果要使用作用域安全的构造函数窃取模式的话,需要结合原型链继承,重写Rectangle的prototype属性,使它的实例也变成Polygon的实例
function Polygon(sides){
if(this instanceof Polygon){
this.sides=sides;
this.getArea=function(){
return 0;
}
}else{
return new Polygon(sides);
}
}
function Rectangle(wifth,height){
Polygon.call(this,2);
this.width=this.width;
this.height=height;
this.getArea=function(){
return this.width * this.height;
};
}
Rectangle.prototype= new Polygon();
var rect= new Rectangle(5,10);
console.log(rect.sides); //
以上就是作用域安全性的一些理解 !接下来几篇文章就来讲解下对惰性载入函数
javascript函数中的三个技巧【一】的更多相关文章
- javascript函数中的三个技巧【二】
技巧二: [惰性载入函数] 因为浏览器之间的行为的差异,我们经常会在函数中包含了大量的if语句,以检查浏览器特性,解决不同浏览器的兼容问题,比如,我们最常见的为dom节点添加时间的函数 functio ...
- javascript函数中的三个技巧【三】
技巧三: [函数绑定] 在javascript与DOM交互中经常需要使用函数绑定,定义一个函数然后将其绑定到特定DOM元素或集合的某个事件触发程序上,绑定函数经常和回调函数及事件处理程序一起使用,以便 ...
- 深入理解javascript函数系列第三篇——属性和方法
× 目录 [1]属性 [2]方法 前面的话 函数是javascript中的特殊的对象,可以拥有属性和方法,就像普通的对象拥有属性和方法一样.甚至可以用Function()构造函数来创建新的函数对象.本 ...
- 深入理解javascript函数系列第三篇
前面的话 函数是javascript中特殊的对象,可以拥有属性和方法,就像普通的对象拥有属性和方法一样.甚至可以用Function()构造函数来创建新的函数对象.本文是深入理解javascript函数 ...
- Javascript函数中传递带空格的参数
通常在页面中要让某些内容点击后产 生点击事件(非页面跳转)都会使用onclick,但是这样不适于需要传递参数的情况,于是写成直接调用Javascript函数的方式:<a href=javascr ...
- Javascript函数中的高级运用
先介绍一下js中的高阶函数,所谓的高阶函数就是,一个函数中的参数是一个函数或者返回的是一个函数,就称为高阶函数. js中已经提高了一下高阶函数,使用起来非常棒,当然我们也可以自己实现,我介绍几种ES5 ...
- 在JavaScript函数中使用EL表达式注意的事项
最近在使用JSP显示从Servlet带过来的数据时,大量的使用到了EL表达式,并且有些EL表达式是在使用到JavaScript的函数时作为参数传入的,举个例子,比如下面的样子: 这个HTML标签的意思 ...
- JavaScript函数中的参数(arguments)
arguments argument是JavaScript中的一个关键字,用于指向调用者传入的所有参数. function example(x){ alert(x); alert(arguments. ...
- javascript 函数初探 (三)--- javascript 变量的作用域
javascript 变量的作用域: 这是一个至关重要的问题.特别是当我们从别的语言转向javascript时,必须要明白一点,即在javascript中,变量的定义并不是以代码块作为作用域的,而是以 ...
随机推荐
- 使用NSKeyedArchiver归档
将各种类型的对象存储到文件中,而不仅仅是字符串.数组和字典类型,有一种更灵活的方法.就是利用NSKeyedAarchiver类创建带键(keyed)的档案来完成. Mac OS X从版本10.2开始支 ...
- 使用jQuery开发一个带有密码强度检验的超酷注册页面
在今天的jQuery教程中,我们将介绍如何使用jQuery和其它相关的插件来生成一个漂亮的带有密码强度检验的注册页面,希望大家喜欢! 相关的插件和类库 complexify - 一个密码强度检验jQu ...
- netty ByteToMessageDecoder 分析
ByteToMessageDecoder 1.socket 移除时触发,最后次读数据处理 @Override public final void handlerRemoved(ChannelHandl ...
- VPN理论简单介绍(转载)
标签:VPN理论简单介绍 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://lvnian.blog.51cto.com/715528 ...
- easyui + jdbc 实现简单的数据库管理。
/** * 分页未完成 ,执行sql 查询 与 更新未完成. * 代码拿去,有同学完成了可以再分享出来. * 代码稍微有些乱,没时间整理. * 暂时仅支持oracle ,因sql语句黏合度太高. * ...
- Flex Array 与 ArrayCollection.转自网络
1.array作为控件使用 FLEX3写法: <mx:Array id="barname"> <mx:String>Flash</mx:String& ...
- AssetBundle系列——场景资源之打包(一)
本篇讲解的是3D游戏的场景资源打包方式,首先简单的分析一下场景中所包含的资源的类型. 场景资源一般包含:地表模型(或者是Unity Terrain),非实例化物体(摄像机.空气墙.光源.各种逻辑物体之 ...
- http协议客户端向服务器端请求时一般需要发送的内容
out.println("GET /shopping/index.html HTTP/1.1");//请求行 包括请求方式,文件路径, http协议版本(必写)请求头.... ou ...
- Tools - 为知笔记
为知笔记 Homepage Web登陆 帮助支持 功能 特色功能 发布到blog 便携版制作 模板 如何建立模板 下载为知笔记模版 Markdown http://www.wiz.cn/markdow ...
- JS中 escape, encodeURI 和 encodeURIComponent的区别
为避免Url字符串在传递过程中的乱码,我们一般需要对字符串进行处理. 在Javascript中实现此功能的全局对象有3个,分别是:escape(), encodeURI() 和 encodeURI ...