您能提供一个柯里化函数的例子,以及为什么这个语法会有优势?
柯里化是一种模式,即一个有多个参数的函数被分解成多个函数,当被串联调用时,将一次积累所有需要的参数。 这种技术有助于使以函数式风格的代码更容易阅读和组合。 值得注意的是,要使一个函数被柯里化,它需要从一个函数开始,然后分解成一连串的函数,每个函数接受一个参数。
js
function curry(fn) {
if (fn.length === 0) {
return fn;
}
function _curried(depth, args) {
return function (newArgument) {
if (depth - 1 === 0) {
return fn(...args, newArgument);
}
return _curried(depth - 1, [...args, newArgument]);
};
}
return _curried(fn.length, []);
}
function add(a, b) {
return a + b;
}
var curriedAdd = curry(add);
var addFive = curriedAdd(5);
var result = [0, 1, 2, 3, 4, 5].map(addFive); // [5, 6, 7, 8, 9, 10]
描述事件冒泡过程
事件冒泡是 DOM(文档对象模型)中的一种传播机制,其中事件,如点击或键盘事件,首先在启动事件的目标元素上触发,然后向上(冒泡)通过 DOM 树传播到文档的根部。
冒泡阶段
在冒泡阶段期间,事件从目标元素开始,并通过其在 DOM 层次结构中的祖先向上冒泡。这意味着附加到目标元素及其祖先的事件处理程序都有可能接收并响应事件。
以下是使用现代 ES6 语法演示事件冒泡的示例:
js
// HTML:
// <div id="parent">
// <button id="child">点击我!</button>
// </div>
const parent = document.getElementById("parent");
const child = document.getElementById("child");
parent.addEventListener("click", () => {
console.log("单击了父元素");
});
child.addEventListener("click", () => {
console.log("单击了子元素");
});
当单击 "点击我!" 按钮时,由于事件冒泡,子元素和父元素的事件处理程序都将被触发。
阻止传播
在冒泡阶段,可以使用 stopPropagation()
方法停止事件传播。如果事件处理程序调用 stopPropagation()
,它将阻止事件继续向上冒泡到 DOM 树,确保只有位于层次结构中的元素的处理程序被执行。
事件委托
事件冒泡是一种称为 "事件委托" 的技术的基础,其中将单个事件处理程序附加到多个元素的共同祖先,并使用事件委托有效地处理这些元素的事件。当您有大量类似元素,例如项目列表时,希望避免为每个项目附加单独的事件处理程序时,这种方法特别有用。