简介
1、每个函数都是 Function 类型的实例,而且都与其他引用类型一样具有属性和方法
2、由于函数是对象,因此函数名实际上也是一个指向函数对象的指针,不会与某个函数绑定
3、函数是对象,函数名是指针
例如:
//1 function sum (num1, num2) { return num1 + num2; } //这与下面使用函数表达式定义函数的方式几乎相差无几。 var sum = function(num1, num2){ return num1 + num2; }; //2 function sum(num1, num2){ return num1 + num2; } alert(sum(10,10)); //20 var anotherSum = sum; alert(anotherSum(10,10)); //20 sum = null; alert(anotherSum(10,10)); //20 //一个函数可能会有多个名字,由于函数名仅仅是指向函数的指针,因此函数名与包含对象指针的其他变量没有什么不同
没有重载
将函数名想象为指针,如果声明了两个同名函数,而结果则是后面的函数覆盖了前面的函数
例如:
//函数声明 function addSomeNumber(num){ return num + 100; } function addSomeNumber(num) { return num + 200; } var result = addSomeNumber(100); //300 //函数表达式 var addSomeNumber = function (num){ return num + 100; }; addSomeNumber = function (num) { return num + 200; }; var result = addSomeNumber(100); //300 //在创建第二个函数时,实际上覆盖了引用第一个函数的变量 addSomeNumber
函数声明
解析器会率先读取函数声明,并使其在执行任何代码之前可用(可以访问)
例如:
alert(sum(10,10)); function sum(num1, num2){ return num1 + num2; } //代码可运行,因为在代码开始执行之前,解析器就已经通过一个名为函数声明提升 (function declaration hoisting)的过程,读取并将函数声明添加到执行环境中
函数表达式
函数必须等到解析器执行到它所在的代码行,才会真正被解释执行
例如:
alert(sum(10,10)); var sum = function(num1, num2){ return num1 + num2; }; //在执行到函数所在的语句之前,变量 sum 中不会保存有对函数的引用;而且,由于第一行代码就会导致“unexpected identifier”(意外标识符)错误,实际上也不会执行到下一行
补充
使用 Function 构造函数(最后一个参数始终都被看成是函数体,而前面的参数则枚举出了新函数的参数),从技术角度讲,这是一个函数表达式
var sum = new Function("num1", "num2", "return num1 + num2"); // 不推荐
这种语法会导致解析两次代码(第一次是解析常规 ECMAScript 代码,第二次是解析传入构造函数中的字符串), 从而影响性能
作为值的函数
1、因为 ECMAScript 中的函数名本身就是变量,所以函数也可以作为值来使用
2、不仅可以像传递参数一样把一个函数传递给另一个函数,而且可以将一个函数作为另一个函数的结果返回
例如:
//1 function callSomeFunction(someFunction, someArgument){ return someFunction(someArgument); } //2 function add10(num){ return num + 10; } var result1 = callSomeFunction(add10, 10); alert(result1); //20 function getGreeting(name){ return "Hello, " + name; } var result2 = callSomeFunction(getGreeting, "Nicholas"); alert(result2); //"Hello, Nicholas" //callSomeFunction()函数是通用的,即无论第一个参数中传递进来的是什么函数,它都会返回执行第一个参数后的结果 //3 //可以从一个函数中返回另一个函数,比如要根据某个对象属性对数组进行排序,而传递给数组 sort()方法的比较函数要接收两个参数,即要比较的值,定义一个函数,它接收一个属性名,然后根据这个属性名来创建一个比较函数 function createComparisonFunction(propertyName) { return function(object1, object2){ var value1 = object1[propertyName]; var value2 = object2[propertyName]; if (value1 < value2){ return -1; } else if (value1 > value2){ return 1; } else { return 0; } }; } var data = [{name: "Zachary", age: 28}, {name: "Nicholas", age: 29}]; data.sort(createComparisonFunction("name")); alert(data[0].name); //Nicholas data.sort(createComparisonFunction("age")); alert(data[0].name); //Zachary
函数内部属性
arguments
1、arguments是一个类数组对象,包含着传入函数中的所有参数
2、arguments有一个名叫 callee 的属性,该属性是一个指针,指向拥有这个 arguments 对象的函数
例如:
//阶乘函数 function factorial(num){ if (num <=1) { return 1; } else { return num * factorial(num-1) } } //问题是这个函数的执行与函数名 factorial 紧紧耦合在了一起。为了消除这种紧密耦合的现象,可以像下面这样使用 arguments.callee function factorial(num){ if (num <=1) { return 1; } else { return num * arguments.callee(num-1) } } //在这个重写后的 factorial()函数的函数体内,没有再引用函数名 factorial。这样,无论引用 函数时使用的是什么名字,都可以保证正常完成递归调用 var trueFactorial = factorial; factorial = function(){ return 0; }; alert(trueFactorial(5)); //120 alert(factorial(5)); //0
this
this 引用的是函数据以执行的环境对象(当在网页的全局作用域中调用函数时, this 对象引用的就是 window)
例如:
window.color = "red"; var o = { color: "blue" }; function sayColor(){ alert(this.color); } sayColor(); //"red" o.sayColor = sayColor; o.sayColor(); //"blue"
caller
这个属性中保存着调用当前函数的函数的引用, 如果是在全局作用域中调用当前函数,它的值为 null
例如:
function outer(){ inner(); } function inner(){ alert(inner.caller); } outer(); //outer()调用了 inter(),所以 inner.caller 就指向 outer() //了实现更松散的耦合,也可以通过 arguments.callee.caller 来访问相同的信息 function outer(){ inner(); } function inner(){ alert(arguments.callee.caller); } outer();
注意
(1)当函数在严格模式下运行时,访问 arguments.callee 会导致错误
(2)ECMAScript 5 定义了 arguments.caller 属性,但在严格模式下访问它也会导致错误,而在非严格模式下这个属性始终是undefined
(3)严格模式还有一个限制:不能为函数的 caller 属性赋值,否则会导致错误
函数属性和方法
属性
length
length 属性表示函数希望接收的命名参数的个数
例如:
function sayName(name){ alert(name); } function sum(num1, num2){ return num1 + num2; } function sayHi(){ alert("hi"); } alert(sayName.length); //1 alert(sum.length); //2 alert(sayHi.length); //0
prototype
1、对于 ECMAScript 中的引用类型而言,prototype 是保存它们所有实例方法的真正所在
2、创建自定义引用类型以及实现继承时,prototype 属性的作用极为重要
3、prototype 属性是不可枚举的,因此使用 for-in 无法发现
方法
apply()
apply()方法接收两个参数:一个是在其中运行函数的作用域,另一个是参数数组
例如:
function sum(num1, num2){ return num1 + num2; } function callSum1(num1, num2){ return sum.apply(this, arguments); // 传入 arguments 对象 } function callSum2(num1, num2){ return sum.apply(this, [num1, num2]); // 传入数组 } alert(callSum1(10,10)); //20 alert(callSum2(10,10)); //20
call()
1、第一个参数是 this 值没有变化,变化的是其余参数都直接传递给函数,在使用 call()方法时,传递给函数的参数必须逐个列举出来
例如:
function sum(num1, num2){ return num1 + num2; } function callSum(num1, num2){ return sum.call(this, num1, num2); } alert(callSum(10,10)); //20 //在使用 call()方法的情况下,callSum()必须明确地传入每一个参数
2、使用 call()(或 apply())来扩充作用域的最大好处,就是对象不需要与方法有任何耦合关系
例如:
window.color = "red"; var o = { color: "blue" }; function sayColor(){ alert(this.color); } sayColor(); //"red" o.sayColor = sayColor; o.sayColor(); //"blue" window.color = "red"; var o = { color: "blue" }; function sayColor(){ alert(this.color); } sayColor(); //red sayColor.call(this); //red sayColor.call(window); //red sayColor.call(o); //blue //先将 sayColor()函数放到了对象 o 中,然后再通过 o 来调用它的; 而在这里重写的例子中,就不需要先前那个多余的步骤了
bind()
这个方法会创建一个函数的实例,其 this 值会被绑 定到传给 bind()函数的值
例如:
window.color = "red"; var o = { color: "blue" }; function sayColor(){ alert(this.color); } var objectSayColor = sayColor.bind(o); objectSayColor(); //blue
特点
1、如果直接传入 arguments 对象,或者包含函数中先接收到的也是一个数组,那么使用 apply() ;否则,选择 call()可能更合适
2、传递参数并非 apply()和 call()真正的用武之地;它们真正强大的地方是能够扩充函数赖以运行的作用域
例如:
window.color = "red"; var o = { color: "blue" }; function sayColor(){ alert(this.color); } sayColor(); //red sayColor.call(this); //red sayColor.call(window); //red sayColor.call(o); //blue //sayColor.call(this)和 sayColor.call(window),则是两种显式地在全局作用域中调用函数的方式,结果都会显示"red" //当运行 sayColor.call(o) 时,函数的执行环境就不一样了,因为此时函数体内的 this 对象指向了 o,于是结果显示的是"blue"
总结
1、ECMAScript没有函数重载的概念,因为如果声明了两个同名函数,结果是后面的函数覆盖了前面的函数
2、(1)函数声明时,解析器会率先读取函数声明,并使其在执行任何代码之前可用(可以访问)
(2)函数表达式,则必须等到解析器执行到它所在的代码行,才会真正被解释执行
3、函数是对象,函数名是指针
4、apply()和 call(),这两个方法的用途都是在特定的作用域中调用函数,实际上等于设置函数体内 this 对象的值
5、call()方法与 apply()方法的作用相同,它们的区别仅在于接收参数的方式不同
(1)apply()方法接收两个参数:一个是在其中运行函数的作用域,另一个是参数数组
(2)对于 call() 方法而言,第一个参数是 this 值没有变化,变化的是其余参数都直接传递给函数
6、因为 ECMAScript 中的函数名本身就是变量,所以函数也可以作为值来使用,不仅可以像传递参数一样把一个函数传递给另一个函数,而且可以将一个函数作为另一个函数的结果返回
7、函数内部属性有arguments,this和caller,其中arguments.callee指向拥有这个arguments对象的函数,caller保存着调用当前函数的函数的引用
8、函数属性主要是length和prototype,方法主要有apply(),call()和bind()