Skip to content

Commit

Permalink
🎨 optimize code (#2924)
Browse files Browse the repository at this point in the history
  • Loading branch information
kuitos authored Mar 11, 2024
1 parent cbd6cc0 commit eeebd3f
Showing 1 changed file with 33 additions and 38 deletions.
71 changes: 33 additions & 38 deletions src/sandbox/patchers/windowListener.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
/* eslint-disable no-param-reassign */
/**
* @author Kuitos
* @since 2019-04-11
Expand All @@ -17,61 +16,58 @@ type ListenerMapObject = {

const DEFAULT_OPTIONS: AddEventListenerOptions = { capture: false, once: false, passive: false };

// 移除cacheListener
const normalizeOptions = (rawOptions?: boolean | AddEventListenerOptions): AddEventListenerOptions => {
if (typeof rawOptions === 'object') {
return rawOptions ?? DEFAULT_OPTIONS;
}
return { capture: !!rawOptions, once: false, passive: false };
};

const findListenerIndex = (
listeners: ListenerMapObject[],
rawListener: EventListenerOrEventListenerObject,
options: AddEventListenerOptions,
): number =>
listeners.findIndex((item) => item.rawListener === rawListener && item.options.capture === options.capture);

const removeCacheListener = (
listenerMap: Map<string, ListenerMapObject[]>,
type: string,
rawListener: EventListenerOrEventListenerObject,
rawOptions?: boolean | AddEventListenerOptions,
): ListenerMapObject => {
// 处理 options,确保它是一个对象
let options = typeof rawOptions === 'object' ? rawOptions : { capture: !!rawOptions };
// 如果 options 为 null,使用默认值
options = options ?? DEFAULT_OPTIONS;

const options = normalizeOptions(rawOptions);
const cachedTypeListeners = listenerMap.get(type) || [];
// listener和capture/useCapture都相同,认为是同一个监听
// https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/removeEventListener
const findIndex = cachedTypeListeners.findIndex(
(item) => item.rawListener === rawListener && item.options.capture == options.capture,
);

const findIndex = findListenerIndex(cachedTypeListeners, rawListener, options);
if (findIndex > -1) {
const cacheListener = cachedTypeListeners[findIndex];
cachedTypeListeners.splice(findIndex, 1);
return cacheListener;
return cachedTypeListeners.splice(findIndex, 1)[0];
}

// 返回原始listener和options
return { listener: rawListener, rawListener, options };
};

// 添加监听构造一个cacheListener对象,考虑到多次添加同一个监听和once的情况
const addCacheListener = (
listenerMap: Map<string, ListenerMapObject[]>,
type: string,
rawListener: EventListenerOrEventListenerObject,
rawOptions?: boolean | AddEventListenerOptions,
): ListenerMapObject | undefined => {
// 处理 options,确保它是一个对象
let options = typeof rawOptions === 'object' ? rawOptions : { capture: !!rawOptions };
// 如果 options 为 null,使用默认值
options = options ?? DEFAULT_OPTIONS;

const options = normalizeOptions(rawOptions);
const cachedTypeListeners = listenerMap.get(type) || [];
// listener和capture/useCapture都相同,认为是同一个监听
// https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener
const findIndex = cachedTypeListeners.findIndex(
(item) => item.rawListener === rawListener && item.options.capture == options.capture,
);
// 如果事件已经添加到了target的event listeners 列表中,直接返回不需要添加第二次

const findIndex = findListenerIndex(cachedTypeListeners, rawListener, options);
// avoid duplicated listener in the listener list
if (findIndex > -1) return;

let listener: EventListenerOrEventListenerObject = rawListener;
if (options.once)
if (options.once) {
listener = (event: Event) => {
(rawListener as EventListener)(event);
removeCacheListener(listenerMap, type, rawListener, options);
};
}

const cacheListener = { listener, options, rawListener };
listenerMap.set(type, [...cachedTypeListeners, cacheListener]);
return cacheListener;
Expand All @@ -86,10 +82,9 @@ export default function patch(global: WindowProxy) {
rawOptions?: boolean | AddEventListenerOptions,
) => {
const addListener = addCacheListener(listenerMap, type, rawListener, rawOptions);
// 如果返回空,则代表事件已经添加过了,不需要重复添加

if (!addListener) return;
const { listener, options } = addListener;
return rawAddEventListener.call(window, type, listener, options);
return rawAddEventListener.call(global, type, addListener.listener, addListener.options);
};

global.removeEventListener = (
Expand All @@ -98,18 +93,18 @@ export default function patch(global: WindowProxy) {
rawOptions?: boolean | AddEventListenerOptions,
) => {
const { listener, options } = removeCacheListener(listenerMap, type, rawListener, rawOptions);
return rawRemoveEventListener.call(window, type, listener, options);
return rawRemoveEventListener.call(global, type, listener, options);
};

return function free() {
listenerMap.forEach((listeners, type) =>
[...listeners].forEach(({ rawListener, options }) => global.removeEventListener(type, rawListener, options)),
);
// 清空listenerMap,避免listenerMap中还存有listener导致内存泄漏
listenerMap.forEach((listeners, type) => {
listeners.forEach(({ rawListener, options }) => {
global.removeEventListener(type, rawListener, options);
});
});
listenerMap.clear();
global.addEventListener = rawAddEventListener;
global.removeEventListener = rawRemoveEventListener;

return noop;
};
}

0 comments on commit eeebd3f

Please sign in to comment.