<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
/*
因为 ECMAScript 中的函数名本身就是变量，所以函数也可以作为值来使用。
也就是说，不仅可以像传递参数一样把一个函数传递给另一个函数，而且可以将一个函数作为另一个函数的结果返回。
来看看下面的函数：
*/
function callSomeFunction(someFunction, someArgument) {
return someFunction(someArgument)
}
/*
这个函数接受两个参数。第一个参数是一个函数，第二个参数是要传递给函数的一个值。
然后，就可以像下面的例子一样传递函数了。
*/
function add10(num) {
return num + 10
}
var result1 = callSomeFunction(add10, 50)
console.log(result1) // 60
function getGreeting(name) {
return 'Hello,' + name
}
var result2 = callSomeFunction(getGreeting, 'jack')
console.log(result2) // Hello,jack
/*
当然，可以从一个函数中返回另一个函数，而且这也是极为有用的一种技术。
例如：假设有一个对象数组，我们想要根据某个对象属性对数组进行排序。
而传递给数组 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
}
}
}
/*
这个函数定义看起来有点复杂，但实际上无非就是一个函数中嵌套了另一个函数，而且内部函数前面加了一个 return 操作符。
在内部函数接收到 propertyName 参数后，它会使用方括号表示法来取得给定属性的值。取得了想要的属性值之后，定义比较函数就非常简单了。
上面的函数可以像在下面例子中这样使用。
*/
var data = [{name: 'aaa', age: 28}, {name: 'bbb', age: 29}]
data.sort(createComparisonFunction('name'))
console.log(data[0].name)
data.sort(createComparisonFunction('age'))
console.log(data[0].age)
/*
函数内部属性
在函数内部，有两个特殊的对象：arguments 和 this
其中，arguments 是一个类数组对象，包含着传入函数中的所有参数。虽然 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)
}
}
/*
函数内部的另一个特殊对象是 this ，其行为与 java c# 中的 this 大致类似。
换句话说，this 引用的是函数执行的环境对象 --- 或者也可以说是 this 值（当在网页的全局作用域中调用函数时，this 对象引用的就是 window）
*/
/*
函数的属性和方法
ECMAScript 中的函数是对象，因此函数也有属性和方法。
每个函数都包含两个属性：length 和 prototype 。
length 属性： 表示函数希望接收的命名参数的个数
prototype 属性：
在 ECMAScript 核心所定义的全部属性中，最耐人寻味的就要数 prototype 属性了。
对于 ECMAScript 中的引用类型而言，prototype 是保存它们所有实例方法的真正所在。
换句话说，诸如 toString() 和 valueOf() 等方法实际上都保存在 prototype 名下，只不过是通过各自对象的实例访问罢了。
在创建自定义引用类型以及实现继承时，prototype 属性的作用是极为重要的。
在 ECMAScript5 中，prototype 属性是不可枚举的，因此使用 for-in 无法实现。
每个函数都包含两个非继承而来的方法：apply() 和 call() 。
这两个方法的用途都是在特定的作用域中调用函数，实际上等于设置函数体内 this 对象的值。
首先，apply() 方法接收两个参数：一个是在其中运行函数的作用域，另一个是参数数组。
其中，第二个参数可以是 Array 的实例，也可以是 arguments 对象。
例如：
*/
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]) // 传入数组
}
console.log(callSum1(10, 10)) // 20
console.log(callSum2(30, 30)) // 60
/*
call() 方法和 apply() 方法相同，它们的区别仅在于接收参数的方式不同。
对于 call() 方法而言，第一个参数是 this 值没有变化，变化的是其余参数都直接传递给函数。
换句话说，在使用 call() 方法时，传递给函数的参数必须逐个列举出来，如下：
*/
function sum3(num3, num4) {
return num3 + num4
}
function callSum3(num3, num4) {
return sum3.call(this, num3, num4)
}
console.log(callSum3(20, 20))
/*
事实上，传递参数并非是 apply() 和 call() 真正的用武之地，它们真正强大的地方是能够扩充函数赖以运行的作用域。
使用 call() 或 apply() 来扩充作用域的最大好处，就是对象不需要与方法有任何耦合关系
*/
/*
ECMAScript5 还定义了一个方法：bind()
这个方法会创建一个函数的实例，其 this 值会被绑定到传给 bind() 函数的值。例如：
*/
window.color = 'red'
var o = { color: 'blue' }
function sayColor() {
console.log(this.color) // blue
}
var objectSayColor = sayColor.bind(o)
objectSayColor()
</script>
</body>
</html>
02_Function类型_作为值得函数
最新推荐文章于 2024-08-14 09:04:24 发布
2407
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
