跳到主要内容

Function 函数

一，函数属性​

1. length 获得函数参数数量​

  • Function 实例的 length 数据属性表示函数期望的参数数量。
function func1() {}
function func2(a, b) {}
console.log(func1.length)
// output: 0
console.log(func2.length)
// output: 2
更多实例
console.log(Function.length) // 1

console.log((() => {}).length) // 0
console.log(((a) => {}).length) // 1
console.log(((a, b) => {}).length) // 2，依此类推

console.log(((...args) => {}).length)
// 0，剩余参数不计算在内

console.log(((a, b = 1, c) => {}).length)
// 1，只计算第一个具有默认值的参数之前的参数

2. name 获得函数名称​

  • Function 实例的 name 数据属性表示函数在创建时指定的名称，或者如果函数是匿名函数，则名称可以是 anonymous 或 ''（空字符串）。
const func1 = function () {}
const object = {
  func2: function () {},
}
console.log(func1.name)
// output: "func1"
console.log(object.func2.name)
// output: "func2"

3. Function.prototype.prototype 函数的原型​

  • 当 Function 实例作为构造函数与 new 运算符一起使用时，该实例的 prototype 数据属性将用作新对象的原型。
  • 备注： 并不是所有的 Function 对象都拥有 prototype 属性——参见描述。
  • 在使用 new 运算符调用函数时，构造函数的 prototype 属性将成为新对象的原型。
function Ctor() {}
const inst = new Ctor()
console.log(Object.getPrototypeOf(inst) === Ctor.prototype)
// true
通过修改原型的属性来修改所有实例的原型
function Ctor() {}
const p1 = new Ctor()
const p2 = new Ctor()
Ctor.prototype.prop = 1
console.log(p1.prop) // 1
console.log(p2.prop) // 1

二，函数方法​

1. Function.prototype.apply()​

  • Function 实例的 apply() 方法会以给定的 this 值和作为数组（或类数组对象）提供的 arguments 调用该函数。
  • 备注： 这个函数与 call() 几乎完全相同，只是函数参数在 call() 中逐个作为列表传递，而在 apply() 中它们会组合在一个对象中，通常是一个数组——例如，func.call(this, "eat", "bananas") 与 func.apply(this, ["eat", "bananas"])。
语法：apply(thisArg)，apply(thisArg, argsArray)
const numbers = [5, 6, 2, 3, 7]
const max = Math.max.apply(null, numbers)
console.log(max)
// output: 7
const min = Math.min.apply(null, numbers)
console.log(min)
// output: 2

2. Function.prototype.call()​

  • Function 实例的 call() 方法会以给定的 this 值和逐个提供的参数调用该函数。
语法：call(thisArg, arg1, arg2, /* …, */ argN)
function Product(name, price) {
  this.name = name
  this.price = price
}
function Food(name, price) {
  Product.call(this, name, price)
  this.category = 'food'
}
console.log(new Food('cheese', 5).name)
// output: "cheese"

3. Function.prototype.bind()​

  • Function 实例的 bind() 方法创建一个新函数，当调用该新函数时，它会调用原始函数并将其 this 关键字设置为给定的值，同时，还可以传入一系列指定的参数，这些参数会插入到调用新函数时传入的参数的前面。
语法：bind(thisArg, arg1, arg2, /* …, */ argN)
const module = {
  x: 42,
  getX: function () {
    return this.x
  },
}
const unboundGetX = module.getX
console.log(unboundGetX()) // 函数在全局范围内被调用
// output: undefined
const boundGetX = unboundGetX.bind(module)
console.log(boundGetX())
// output: 42

4. Function.prototype.toString() 将函数代码变成字符串​

  • Function 实例的 toString() 方法返回一个表示该函数源码的字符串。
  • 使用 eval()，可以将字符串按函数执行
语法：toString()
function sum(a, b) {
  return a + b
}
console.log(sum.toString())
// output: "function sum(a, b) {
//                     return a + b;
//                   }"

console.log(Math.abs.toString())
// output: "function abs() { [native code] }"
语法：eval(string)
console.log(eval('2 + 2'))
// output: 4

console.log(eval(new String('2 + 2')))
// output: 2 + 2

console.log(eval('2 + 2') === eval('4'))
// output: true

console.log(eval('2 + 2') === eval(new String('2 + 2')))
// output: false