javascript & call & apply & bind & new
Javascript call() & apply() vs bind()?
https://stackoverflow.com/questions/15455009/javascript-call-apply-vs-bind
https://medium.com/@homicidalgecko/javascript-call-vs-apply-vs-bind-61447bc5e989
https://codeplanet.io/javascript-apply-vs-call-vs-bind/
this
bind
call
apply
new
demo
const ZoomModule = () => {
const zoomIO = () => {
// this === e.target;
console.log(`this =`, this);
// undefined ???
// console.log(`this.innerText =`, this.innerText, typeof(this.innerText));
let text = this.innerText;
if (text === "放大") {
this.innerHTML = "缩小";
} else {
this.innerHTML = "放大";
}
// this === e.target;
// console.log(`this =`, this);
// console.log(`this.parentNode =`, this.parentNode);
// console.log(`this.parentNode.parentNode =`, this.parentNode.parentNode);
// console.log(`this.parentNode.parentNode.nextElementSibling =`, this.parentNode.parentNode.nextElementSibling);
// console.log(`this.parentNode.parentNode.parentNode =`, this.parentNode.parentNode.parentNode);
this.parentNode.style.width = "1024px !important";
this.parentNode.style.maxWidth = "1024px !important";
this.parentNode.parentNode.style.width = "1024px !important";
this.parentNode.parentNode.style.maxWidth = "1024px !important";
this.parentNode.parentNode.nextElementSibling.style.width = "1024px !important";
this.parentNode.parentNode.nextElementSibling.style.maxWidth = "1024px !important";
this.parentNode.parentNode.parentNode.classList.toggle(`h5-full-screen`);
};
function zoomIcons() {
console.log(`this =`, this);
if (this.innerText === "放大") {
this.innerHTML = "缩小";
} else {
this.innerHTML = "放大";
}
this.parentNode.style.width = "1024px !important";
this.parentNode.style.maxWidth = "1024px !important";
this.parentNode.parentNode.style.width = "1024px !important";
this.parentNode.parentNode.style.maxWidth = "1024px !important";
this.parentNode.parentNode.nextElementSibling.style.width = "1024px !important";
this.parentNode.parentNode.nextElementSibling.style.maxWidth = "1024px !important";
this.parentNode.parentNode.parentNode.classList.toggle(`h5-full-screen`);
}
let zooms = [...document.querySelectorAll(`[data-zoom="otc-zoom"]`)];
zooms.forEach(
(zoom, i) => {
if (zoom) {
// if (existEvent) ? false : true;
// zoom.addEventListener(`click`, zoomIO);
// zoom.addEventListener(`click`, zoomIO.bind(zoom));
// zoom.addEventListener(`click`, function (e) {
// zoomIO.bind(this)();
// zoomIO.call(zoom);
// zoomIO.call(this);
// zoomIO.apply(this);
// });
// old
zoom.addEventListener(`click`, function (e) {
// func.bind(target)();
// zoomIcons.bind(zoom)(); // OK
zoomIcons.bind(e.target)();
// zoomIcons.call(zoom);
// zoomIcons.apply(zoom);
// zoomIcons.call(this);
// zoomIcons.apply(this);
});
// zoom.addEventListener(`click`, function (e) {
// console.log(`this =`, this);
// if (this.innerText === "放大") {
// this.innerHTML = "缩小";
// } else {
// this.innerHTML = "放大";
// }
// this.parentNode.style.width = "1024px !important";
// this.parentNode.style.maxWidth = "1024px !important";
// this.parentNode.parentNode.style.width = "1024px !important";
// this.parentNode.parentNode.style.maxWidth = "1024px !important";
// this.parentNode.parentNode.nextElementSibling.style.width = "1024px !important";
// this.parentNode.parentNode.nextElementSibling.style.maxWidth = "1024px !important";
// this.parentNode.parentNode.parentNode.classList.toggle(`h5-full-screen`);
// });
}
}
);
};
https://stackoverflow.com/questions/15455009/javascript-call-apply-vs-bind
call & apply
call 和 apply 的区别是什么,哪个性能更好一些
- 使用方式不同
- 性能差异可忽略
Call ( F, V [ , argumentsList ] )
CreateListFromArrayLike
https://www.zhihu.com/question/61088667/answer/184598599
refs
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!