JavaScript对象(一)——Function对象

写在最前面:

对象只是带有属性和方法的特殊数据类型(js的7种数据类型:字符串,数字,布尔,数组,对象,null,undefined)。

JavaScript是面向对象的语言,但是JavaScript和其他面向对象语言不同,它没有类的概念。没有类自然也不会通过类来创建对象,JavaScript基于prototype,而不是基于类。

JavaScript 中的所有事物都是对象:字符串、数值、数组、函数...此外,JavaScript 允许自定义对象。

JavaScript 提供多个内建对象,比如 String、Date、Array 等等,先从Function开始。

对象是带有属性和方法的特殊数据类型,从这句话入手,从三方面看一看Function对象:1、声明(数据类型)2、属性 3、方法

一、声明

  1、函数声明  

function foo(argname1,argname2,...){
   body// do something
}

  2、函数表达式

var foo = function(argname1,argname2,...){
    body// do something
}

  3、Function构造函数

var foo = new Function(argname1,argname2,...,body);

二、属性(不包括继承来的属性)

  1、arguments属性

    获取当前正在执行的 Function 对象的参数(arguments对象)。

  示例:

 1 function ArgTest(arg1, arg2){
 2           var s = "";
 3            s += "The individual arguments are: "
 4           for (n = 0; n < arguments.length; n++){//arguments是对象属性,它本身也是对象,有length属性
 5                   s += ArgTest.arguments[n];
 6                   s += " ";
 7            }
 8            return(s);
 9 }
10 console.log(ArgTest("yuanliang","shuai"));

  输出结果:The individual arguments are: yuanliang shuai 

  2、caller属性

    获取调用当前函数的函数。

    caller 属性只有当函数正在执行时才被定义。 如果函数是从 JavaScript 程序的顶层调用的,则 caller 包含 null。

  示例:

 1 function callerFun(){
 2         console.log(callerFun.caller);//只有函数正在执行时才被定义
 3 }
 4
 5 function init(){
 6         callerFun();
 7 }
 8
 9 init();
10 callerFun();

  输出结果:function init(){callerFun();}  null  //第一次调用callerFun()是通过init函数调用的,故返回init函数,第二次直接调用故返回null

  3、length属性

    获取函数的参数数目

    创建函数的实例后,脚本引擎将该函数的 length 属性初始化为该函数定义中的参数数量。

  示例:

1 function lengthFun(arg1,arg2,arg3,arg4){
2                  console.log("lengthFun‘s length="+lengthFun.length);
3                  console.log("arguments‘ length="+arguments.length);
4 }
5
6 lengthFun(1,2,3);

  输出结果:lengthFun‘s length=4   arguments‘ length=3

  从示例中能够看到,Function对象的length和arguemnts的length不一定相同。

三、方法(不包括继承自Object对象的方法)

  1、apply() 和 call()方法

  见上一篇博客:http://www.cnblogs.com/wangyuanliang/p/4264505.html

  2、bind()方法

  对于给定函数,创建与原始函数相同的主体的绑定函数。 在绑定函数中,this 对象将解析为传入的对象。 绑定函数具有指定的初始参数。

  function.bind(thisArg[,arg1[,arg2[,argN]]])

    function

      必选。 一个函数对象。

    thisArg

      必选。 this 关键字可在新函数中引用的对象。//一个对象,

    arg1[,arg2[,argN]]]

      可选。 要传递到新函数的参数的列表。

  示例1:

 1 function bindFun(value){
 2                       if(typeof value !== ‘number‘)
 3                           console.log("not a number");
 4                       else
 5                           value>=this.min&&value<=this.max?console.log("number is correct!"):console.log("number is wrong!");
 6     }
 7 var option = {max:50,min:10};
 8 var judgeFun = bindFun.bind(option);
 9 judgeFun(30);
10 judgeFun(80);

  输出结果:number is correct! number is wrong!   //第一个在范围之内返回correct 第二个不在范围返回wrong

  这里的参数option对应thisArg,为必填参数

  示例2:

1 function bindParamFun(arg1,arg2,arg3,arg4){
2         console.log("bindParamFun params are : "+arg1+arg2+arg3+arg4);
3     }
4 var emptyObject = {};
5
6 var bindParamFun2 = bindParamFun.bind(emptyObject,"a","b");
7 bindParamFun2("c","d","e");

  输出结果:bindParamFun params are : abcd  //在bindParamFun2中第一个参数是一个空的对象,充当thisArg,如果没有此参数,“a”将被当做thisArg,输出结果将是:bindParamFun params are : bcde

四、一些需要特别注意的地方

  1、如何选择声明方式?

  在(一、声明)中的三种方式中我们应该选择哪一种才是合适的呢?

  大多数javascript书籍里面不推荐使用第三种,原因第三种存在严重的性能问题,这种定义会解析两次代码,第一次是常规的解析这条语句,第二次要把函数里的字符串解析成实际的函数。我们可以通过第三种方式可以理解到:javascript的函数其实是对象(object),而函数名是指向对象的地址。

  函数声明和函数表达式:

  这两个方式在性能上没有太大的去区别,但由于JavaSctipt预加载顺序的不同,在定义函数时需要注意一下。

  代码执行之前,解析器就已经读取函数声明并将其添加到执行环境中,要早于基础基础数据类型的定义。

  示例1:

 1 function foo2(){
 2         console.log("foo1");
 3 }
 4
 5 var fun = foo2;
 6 function foo2(){
 7         fun();
 8         console.log("foo2");
 9 }
10 foo2();

  输出结果:too much recursion  //出现递归,内存溢出

  如果改为:

  示例2:

1 var foo2 = function(){
2     console.log("foo1");
3 };
4 var fun = foo2;
5 var foo2 = function(){
6          fun();
7          console.log("foo2");
8 };
9 foo2();

  输出结果:foo1 foo2 

  原因就是在代码执行前,JavaScript会将function提前定义,即:funciton=>var

                                                   对比

  function foo2(){console.log("foo1");};   //old                var foo2 = function(){console.log("foo1)};    //foo2指向旧的方法

  function foo2(fun();console.log("foo2"));   //new                 var fun  = foo2;                                   //将foo2的地址给fun 即fun指向旧的方法                                

  var fun = foo2;              //fun指向的地址是新的foo2         foo2 = function(){fun();console.log("foo2)};   //foo2指向新的方法的地址 fun不变

  foo2();                //此时就会出现内存溢出         foo2();                     //执行foo2

  2、没有重载

  JavaScript中的function没有重载,后面的定义将会覆盖前面的定义。

1 function foo(arg1,arg2,arg3){
2         console.log("This is a function:"+arg1+arg2+arg3);
3 }
4 function foo(arg1,arg2){
5         console.log("Be Better:"+arg1+arg2);
6 }
7 foo("hello","world","leon");  //没有区执行三个参数的方法

  输出结果:Be Better:helloworld

  明显,在传入三个参数的情况下,仍然执行了后面定义的方法,原因是发生了覆盖而不是重载。相当于:

1 var foo = function(arg1,arg2,arg3){
2         console.log("This is a function:"+arg1+arg2+arg3);
3 }
4
5 foo = function(arg1,arg2){
6         console.log("Be Better:"+arg1+arg2);
7 }
8 foo("hello","world","leon"); 

  

时间: 2024-10-14 02:38:13

JavaScript对象(一)——Function对象的相关文章

Javascript Object、Function对象

1.Object对象 原型对象 原型是对象的一个属性,也就是prototype属性,每个对象都有这个内部属性,而且他本身也是一个对象. ? 1 2 3 4 5 6 <script type="text/javascript">      Object.prototype.num= 10;      alert("添加原型对象属性:"+ Object.num);      Object.num = 20;      alert("添加对象属性:&

javascript中的function对象

function对象都是Function的实例: > Object.getOwnPropertyNames(Function) [ 'length', 'name', 'arguments', 'caller', 'prototype' ] 所以function对象也应该有这些方法或者是属性: <script type="text/javascript"> var myFunction = function func(name,age){ //请注意,直接调用这个函数

Javascript高级篇-Function对象

1.引入 1.1Function是基于原型的对象 2.创建Function对象 2.1 var myFun = new Function("参数一","参数二","alert(参数一+参数二);"); 3.Function对象的属性 3.1 length:得出方法参数的个数 4.Function对象的方法 4.1 toString():打印出方法的源码 4.2 valueOf():(作用同toString)

javaScript的函数(Function)对象的声明(@包括函数声明和函数表达式)

平时再用js写函数的时候,一般都是以惯例 function fn () {} 的方式来声明一个函数,在阅读一些优秀插件的时候又不免见到 var fn = function () {} 这种函数的创建,究竟他们用起来有什么区别呢,今天就本着打破砂锅问到底的精神,好好来说说这个让人神魂颠倒的--函数声明.  函数声明 函数声明示例代码 function fn () { console.log('fn 函数执行..'); // code.. } 这样我们就声明了一个名称为fn的函数,这里出个思考,你认

Object对象和function对象

Obejct对象 1.ECMAScript 中的 Object 对象与 Java 中的 java.lang.Object 相似. 2.ECMAScript中的所有对象都由Object对象继承而来,Object对象中的所欲属性和方法都会出现在其他对象中. 3.Obejct的属性 constructor:对创建对象的函数的引用(指针),该指针指向原始的Object()函数. Prototype:对于所有的对象,他默认返回Object对象的一个实例. 4.Obejct的方法 hasOwnPropert

JavaScript的function对象

我必须先说Java与JavaScript没有关系,不是我以前想的那个样子的(JavaScript是Java的一种超进化) 在JavaScript中,函数(function)就是对象. JavaScript的函数参数与调用函数的表达式之间的参数关系并不是一一对应的,他们是一种十分微弱的关系. 在JavaScript中,定义function的方式有三种: 第一种: 1 function add(number) 2 { 3 alert(number+20); 4 } 第二种: 1 var add=fu

javascript对象模型和function对象

javascript中,函数就是对象 <html> <head> <script type="text/javascript"> function add(number){ alert(number+20); } var add=function(number){ alert(number+20); } function add(number,number1){ alert(number+30); } var add=function(number)

全面理解Javascript中Function对象的属性和方法

函数是 JavaScript 中的基本数据类型,在函数这个对象上定义了一些属性和方法,下面我们逐一来介绍这些属性和方法,这对于理解Javascript的继承机制具有一定的帮助. 属性(Properties) arguments 获取当前正在执行的 Function 对象的所有参数,是一个类似数组但不是数组的对象,说它类似数组是因为其具有数组一样的访问性质及方式,可以由arguments[n]来访问对应的单个参数的值,并拥有数组长度属性length.还有就是arguments对象存储的是实际传递给

javascript 之Function对象的apply(),call(),bind(),方法和arguments,caller,length属性

注:这篇文章原文:http://www.jb51.net/article/30883.htm 自己作为学习,重新写写. 一.写在前面的话 前端javascript编程还只是略懂皮毛,DOM知道一点,jquey会用一点点,深知夯实基础,了解前端的系统的知识对于web开发(自己主要做的是PHP后台的开发)的重要.固然,要用什么,就查什么(现学现卖)很合理,但对于长远来讲,只是在隔靴捎痒,很难有实际的作为. 故,痛定思痛,应该对web前端,尤其是 javascript开发(过程式-->面向对象-->