功能
作为第一类对象,函数和JS中其他对象一样,类似于其对象类型,函数具有以下功能:
- 通过字面量创建
function fun1() { }
- 赋值给变量、数组项或其他对象的属性
// 为变量赋值一个新函数
let v1 = function fun2() { };
// 向数组中增加一个函数
let arr1 = [];
arr1.push(function () { });
// 给对象的属性赋值为一个新函数
let obj1 = {};
obj1.name = function () {};
- 作为函数的参数来传递
function fun2(test) {
test();
}
fun2(function () { });
- 作为函数的返回值
function fun3() {
return function () {};
}
- 具有动态创建和分配的属性
let v2 = function () {};
v2.name = "test";
- 回调函数是被代码随后“回来调用”的函数,它是一种很常用的函数,特别是在事件处理场景下
let button = document.getElementById("callback");
button.addEventListener("click", function () {
console.log("button 点击了!");
});
- 函数具有属性,而且这些属性能够被存储任何信息,我们可以利用这个特性来做很多事情
// 可以在函数属性中存储另一个函数,用于之后的引用和调用
let store = {
nextId: 1,
cache: {},
add: function (fn) {
// 仅当函数唯一时才将该函数加入缓存
if (!fn.id) {
fn.id = this.nextId++;
this.cache[fn.id] = fn;
return true;
} else {
return false;
}
}
};
function fun4() {}
console.log(store.add(fun4));// true
console.log(store.add(fun4)); // false
// 可以用函数属性创建一个缓存(记忆),用于减少不必要的计算
function f5(value) {
// 计算某个数是否是素数
if (!f5.answers) {
// 给函数创建一个缓存对象属性
f5.answers = {};
}
// 检查value是否已在缓存对象中
if (f5.answers[value] !== undefined) {
return f5.answers[value];
}
// 前提条件该value不能是0和1,因为这两个数不是素数
let isPrime = value !== 0 && value !== 1;
for (let i = 2; i < value; i++) {
if (value % i === 0) {
isPrime = false;
break;
}
}
return f5.answers[value] = isPrime;
}
console.log(f5(5)); // true
console.log(f5.answers[5]); // true
函数定义方式
- 函数声明
function f6() {}
- 函数表达式
// 作为赋值表达式的右值
let v6 = function () {};
// 作为其它函数的参数
f6(function () {});
// 作为函数返回值
function f7() {
return function () {};
}
- 立即函数。JS引擎解析到时会马上执行函数
+function () {console.log("立即函数");}();
-function () {}();
!function () {}();
~function () {}();
(function () {})();
- 箭头函数
let arr2 = [0, 3, 2, 5, 4, 8, 1];
arr2.sort((value1, value2) => value1 - value2);
- 函数构造函数
console.log(new Function("a", "b", "return a + b")(1, 2));
- 生成器函数
function* myGen() {
yield 10;
y = yield "foo";
yield y;
}
let gen = myGen();
console.log(gen.next());// {value: 10, done: false}
console.log(gen.next());// {value: "foo", done: false}
// 第二次函数调用时,遇到yield就把值返回了,并未给y赋值
console.log(gen.next());// {value: undefined, done: false}
console.log(gen.next());// {value: undefined, done: true}
函数参数
- 剩余参数
// 不与任何形参名相匹配的额外实参可能通过剩余参数来引用
function f8(value, ...restParam) {
for (let i = 0; i < restParam.length; i++) {
console.log(`剩余参数:${restParam[i]}`);// 2,3,4
}
}
f8(1, 2, 3, 4);
- 默认参数
function f9(name, action = "舞蹈") {
console.log(`${name}喜欢${action}`)
}
f9("Lily");// Lily喜欢舞蹈
f9("Jack", "蓝球");// Jack喜欢蓝球