当前位置：首页 > news >正文

JavaScript 核心语法与实战笔记：从基础到面试高频题

news 2025/8/17 5:16:57

一、面试高频：apply 与 call 调用模式的区别

apply 和 call 的核心作用一致——改变函数内 this 的指向并立即执行函数，唯一区别是参数传递方式不同：

apply：第二个参数需以数组形式传入，格式为 函数名.apply(this指向, [参数1, 参数2, ...])
- 示例：test.apply(param, [1, 2, 3]);
call：第二个及以后参数需以逗号分隔传入，格式为 函数名.call(this指向, 参数1, 参数2, ...)
- 示例：test.call(param, 1, 2, 3);

实际开发中可根据参数是否已存在于数组中选择：若参数是零散值，call 写法更简洁；若参数已在数组里，apply 无需额外拆解。

二、必懂语法：逗号运算符的规则

逗号运算符的核心规则：执行所有用逗号分隔的表达式，最终返回最后一个表达式的结果。
示例：(i -= 2, [true, 'abc'][i]['length']) 中，先执行 i -= 2（i 从 3 变为 1），再执行 [true, 'abc'][1]['length']（取数组下标 1 的 ‘abc’，再取其长度 3），最终返回 3。

三、实战编程题：从定义到调用（附完整代码）

以下题目覆盖函数、对象、事件绑定等核心场景，均为面试高频考点，附详细注释和运行逻辑。

01 定义“重复执行函数”：指定次数+执行函数

需求：创建函数，接收“执行次数”和“待执行函数”两个参数，按次数重复执行函数。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>重复执行函数</title>
</head>
<script>
// 函数定义：a=执行次数，b=待执行函数
function repeatExecute(a, b) {for (let i = 1; i <= a; i++) {b(); // 每次循环执行函数b}
}
// 函数调用：执行3次，每次打印内容
repeatExecute(3, function() {console.log("第" + i + "次执行函数");
});
</script>
<body></body>
</html>

02 定义“返回函数的函数”：嵌套函数调用

需求：创建函数，其返回值是另一个带打印语句的函数，最终调用并执行打印。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>返回函数的函数</title>
</head>
<script>
// 外层函数：返回一个匿名函数
function getInnerFunc() {return function() {console.log("成功调用内层函数的打印语句");};
}
// 调用方式：外层函数()() → 先执行外层获取内层函数，再执行内层函数
getInnerFunc()();
</script>
<body></body