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中,变量的定义并不是以代码块作为作用域的,而是以 ...
随机推荐
- mem_fun 例子
// functional_mem_fun.cpp // compile with: /EHsc #include <vector> #include <functional> ...
- Web功能之组织结构图
前提:由于项目需要显示组织结构图的形式 工具:VS2010 项目:ASP.NET 自带的web项目 (带模板页) 插件:OrgChart(依赖:OrgChart.dll).JOrgChart 不多说 ...
- 让mingw gdb支持STL,并自动load .gdbinit
环境要求:python (2.7版本可以,3.x没测过),mingw官方版(你可能已经有了),gdb2013-02-04(到这里https://code.google.com/p/qp-gcc/dow ...
- ubuntu 搭建 samba 服务器
. sudo apt-get install samba samba-common . sudo vi /etc/samba/smb.conf [alair's share] path = /home ...
- hdinfo
--------[ 鲁大师 ]-------------------------------------------------------------------------------- 版本: ...
- [转]C# dataGridview 报“索引-1没有值”的解决办法
很多WINFORM的开发人员在DataGridView的开发当中,都会出现“索引-1没有值”这个烦人的问题,其实较早之前,我已经大概知道问题的所在,也找到了解决方法,不过一直没有时间去深入研究一下,今 ...
- windows下远程连接ubantu
要实现windows下连接ubantu需要安装以下软件: 1. windows下安装winSCP 2. Ubantu下安装OpenSSH Server 可以使用命令行安装openSSH Server: ...
- 玩转PowerShell第二节——【利用PsExec进行远程调用】-技术&分享
概述 PowerShell用的最多的地方就是远程调用,在远程机器上执行脚本,监控远程机器的状态,如NLB状态,EventLog,SqlServer DataBase状态等. 本篇将讲到用PsExec. ...
- [Python] Debugger in Pycharm
From: http://blog.csdn.net/u013088062/article/details/50214459 From: http://blog.csdn.net/u013088062 ...
- Tips2:无需Gizmo函数 和 附加Render 实现空物体(GameObject)的可视化
Unity在场景创建过程中,可能会用到很多空物体,如生成器(Spawn)什么的,一般空物体默认是看不到的,其实,空物体可以通过设置为可见的,这样在用到空物体时就能更加方便的编辑和控制了. 1.可以是这 ...