JSX Props 中命名箭头函数和匿名箭头函数之间有区别吗?
Are difference between named arrow function and anonymous arrow function in JSX Props?
ComponentA 示例:
Case 1: with named arrow function callback:
const ComponentA = () => {
const handleClick = () => {... /* do somthing */};
return (
<div onClick={handleClick}>Hello world</div>
)
}
Case 2: with anonymous arrow function callback:
const ComponentA = () => {
return (
<div onClick={() => {/* Do sumthing here */}}>Hello world</div>
)
}
我知道情况 1 和情况 2 会使子重新渲染,但我不知道对内存泄漏的影响。
使用匿名箭头函数与命名箭头函数时是否存在与内存泄漏相关的问题?
非常感谢!
箭头函数始终是匿名的。你所说的命名箭头函数实际上是一个函数赋值
// function assignment, function itself is not named
const handleClick = () => {};
就性能差异而言,没有差异。两者都会在每次重新渲染时创建一个新的引用。
ComponentA 示例:
Case 1: with named arrow function callback:
const ComponentA = () => {
const handleClick = () => {... /* do somthing */};
return (
<div onClick={handleClick}>Hello world</div>
)
}
Case 2: with anonymous arrow function callback:
const ComponentA = () => {
return (
<div onClick={() => {/* Do sumthing here */}}>Hello world</div>
)
}
我知道情况 1 和情况 2 会使子重新渲染,但我不知道对内存泄漏的影响。
使用匿名箭头函数与命名箭头函数时是否存在与内存泄漏相关的问题?
非常感谢!
箭头函数始终是匿名的。你所说的命名箭头函数实际上是一个函数赋值
// function assignment, function itself is not named
const handleClick = () => {};
就性能差异而言,没有差异。两者都会在每次重新渲染时创建一个新的引用。