控制台集成：获取抛出的错误/警告的数量？

Question

所以如果你打开检查器，你会得到这个（如果你不走运的话）：

我正在构建一个显示调试信息的微型 JS 组件 - 有没有办法读取到目前为止遇到的错误和警告的数量？

我可以提出的一个 hacky 解决方案涉及一些技巧，用我自己的替换 console.(error|log|warn) 函数，但我还没有测试它是否适用于所有情况（例如，在我拥有的代码之外）。

有没有更好的方法来做到这一点？

Answer 1

如this 回答中所述，更改本机对象/方法的行为通常不是一个好主意。但是，以下代码应该以一种相当无害的方式为您提供所需的内容：

// Add this IIFE to your codebase:
(() => {
	// Get all of the property names of the console:
	const methodsToTrack = Object.keys(window.console);
	// Create an object to collect total usage tallies in:
	const usageRegistry = {};
	for (let i = 0, j = methodsToTrack.length; i < j; i++) {
		let methodName = methodsToTrack[i];
		// If the property is not a method, don't touch it:
		if(typeof window.console[methodName] !== 'function') {
			continue;
		}
		// Cache the original console method here:
		let consoleMethod = window.console[methodName];
		// Overwrite console's method to increment the counter:
		window.console[methodName] = function () {
			// Defining registry properties here, so the registry only contains values for methods that were accessed:
			usageRegistry[methodName] = usageRegistry[methodName] || 0;
			// Execute the original method's behavior, capturing the returned value (if any) in a var, to return it at the end:
			const returnedValue = consoleMethod(...arguments);
			// Increment the usage registry for the executed method:
			usageRegistry[methodName]++;
			// Return the value the console's method would have returned, so the new method has the same signature as the old.
			return returnedValue;
		};

	}
	// Define a funciton to output the totals to a console log, then clean up after itself:
	window.showConsoleTallies = function () {
		window.console.log(usageRegistry);
		usageRegistry['log']--;
	}
})();

// Examples:
showConsoleTallies();
console.log('log 1');
console.error('error 1');
console.log('log 2');
console.warn('warn 1');
console.error('error 2');
console.log('log 3');
showConsoleTallies();

PS：这是 ECMA6 版本，但如果您希望将其编译为在旧版浏览器中使用，请随时 run it through Babel。