汇盛国际:JavaScript中的普通函数与构造函数比较

时间: 作者:土西

  

[普通函数,构造函数]JavaScript中的普通函数与构造函数比较

  

问题  

  

什么是构造函数?

  
  构造函数与普通函数区别是什么?

  
  用new关键字的时候到底做了什么?

  
  构造函数有返回值怎么办?

  
  构造函数能当普通函数调用吗?

  

  

以下是我的一些理解,理解错误的地方恳请大家帮忙指正,谢谢!

  

  

this  
  this永远指向当前正在被执行的函数或方法的owner。例如:  

  
  
  function test(){  console.log(this);  }  test();  //Window {top: Window, window: Window, location: Location, external: Object, chrome: Object…}
  
  

上面这段代码中,我们在页面中定义了一个test()函数,然后在页面中调用。函数定义在全局时,其owner就是当前页面,也就是window对象。

  

  

this指向的几种情况  

  

1.全局中调用  

  

this.name //this指向window对象  
  
  2.函数调用  

  

test();//test()函数中的this也指向window对象  
  
  3.对象的方法调用  

  

obj1.fn();//obj1对象的fn()方法中的this指向obj1  
  
  4.调用构造函数  
  var dog=new Dog();//构造函数内的this指向新创建的实例对象,也就是这里的dogcall和apply  

  

call和apply的作用一样,只是接受参数的方式不一样,call接受的是多个单个参数,apply接受的是参数数组。

  
  call和apply的作用简单地可以说成,当一个对象实例缺少一个函数/方法时,可以调用其他对象的现成函数/方法,其方式是通过替换其中的this为这个对象实例,改变函数运行时的上下文。

  
  例如:  

  
  
  function Dog(){  this.sound="汪汪汪";  }  Dog.prototype.bark=function(){  alert(this.sound);  }
  
  

现在我有另外一个cat对象:  

  

var cat={sound:'喵喵喵'}  

  

我也想让这个cat对象可以调用bark方法,这时候就不用重新为它定义bark方法了,可以用call/apply调用Dog类的bark方法:  

  

Dog.prototype.bark.call(cat);  

  

或者:  

  

dog.bark.call(cat);  

  

加点东西,变成一个带参数的栗子:  

  
  
  function Dog(){  this.sound="汪汪汪";  }  Dog.prototype.bark=function(words){  alert(this.sound+" "+words);  }  var dog=new Dog();  dog.bark("有小偷");//alert:汪汪汪  有小偷  Dog.prototype.bark.call(cat,"饿了");//alert:喵喵喵  饿了
  
  

普通函数  
  这是一个简单的普通函数:  

  
  
  function fn(){  alert("hello sheila");  }  fn();//alert:hello sheila
  
  

普通函数与构造函数相比有四个明显特点:  

  

1.不需要用new关键字调用  

  

fn();2.可以用return语句返回值  

  
  
  function fn(a,b){  return a+b;  }  alert(fn(2,3));//alert:5
  
  

3.函数内部不建议使用this关键字  
  我们说不建议使用,当然硬要用是可以的,只是要注意这时候发生了什么。如果在普通函数内部使用this关键字定义变量或函数,因为这时候this指向的是window全局对象,这样无意间就会为window添加了一些全局变量或函数。

  

  
  
  function greeting(){  this.name="sheila";  alert("hello "+this.name);  }  greeting();//alert:hello sheila  alert(window.name);//alert:sheila
  
  

4.函数命名以驼峰方式,首字母小写  

  

构造函数  
  在JavaScript中,用new关键字来调用定义的构造函数。默认返回的是一个新对象,这个新对象具有构造函数定义的变量和函数/方法。

  

  

举个栗子:  

  
  
  function Prince(name,age){  this.gender="male";  this.kind=true;  this.rich=true;  this.name=name;  this.age=age;  }  Prince.prototype.toFrog=function(){  console.log("Prince "+this.name+" turned into a frog.");  }  var prince=new Prince("charming",25);  prince.toFrog();//Prince charming turned into a frog.

  prince.kind;//true

  
  

与普通函数相比,构造函数有以下明显特点:  

  

1.用new关键字调用  

  

var prince=new Prince("charming",25);   (责任编辑:admin)

推荐图片Related

相关文章Related

查看更多热门新闻


首页 | 特效插件 | 常用代码 | 样式素材 | 脚本代码 | css特效

Copyright © 2017-2018 汇盛国际 版权所有

系统要求:本站自适应各终端浏览器分辨率

请使用Google、Firefox、IE9、百度浏览器登录网站

网站地图 | RSS订阅 | 汇盛国际平台