一种重置Chrome DevTools控制台上下文的方法

Chrome>DevTools>控制台中是否有清除/重置/移除测试时声明的变量和函数的功能(就像调用Clear,清除日志一样)?

举个例子,我有一个用let keyoword..声明的变量

let str = "Hello";
我通过Console运行了一次,然后再次通过Console运行相同的代码。

是的,它会像预期的那样抛出错误"Identifier‘str’Have Are Claimated",因为变量已经声明,不能再次声明(与使用var关键字声明不同),因此要通过Console重新运行代码,我必须刷新重置框架/目标上下文的页面。

是否有其他选项?


解决方案

正如在注释中已经提到的,代码是在全局范围内计算的,因此,除非重新加载当前窗口,否则无法将使用let等声明的变量取消声明为全局变量。

评估

let str = "Hello";

连续将始终触发Identifier 'str' has already been declared错误。

一种解决方法是将代码作为完整的挡路范围的代码段进行评估:

{
  let str = "Hello";
  console.log(str);
}

注意,块没有返回值(它们是语句而不是表达式),但是挡路中的最后一个表达式是由控制台处理的,所以console.log可以省略。

{ let str = "Hello"; str }

将在控制台中输出Hello

或者,LIFE可用于返回值:

(() => {
  let str = "Hello";
  return str;
})()

经验法则是尽量避免在Console中使用挡路作用域声明,以避免此问题。可以连续无问题地评估此代码段:

  var str = "Hello"; // instead of `let str = "Hello"`
  var Foo = class Foo {} // instead of `class Foo {}`

相关文章