Chrome开发者工具中的JavaScript控制台

用过Python或其它脚本语言都知道，一个简单的命令行控制台是多么的方便：敲一行或几行代码，就立刻能看到代码的结果，根本不需要临时创建个新文件。

JavaScript其实也有的，就是浏览器开发者工具里的Console 面板。

先小试牛刀一下：

你也可以按F12后，切换到Console 面板，复制下面的两段代码，亲手试一下。

程序1：

console.log("欢迎来到乐码范");

程序2：

function sayHello() {
    console.log("欢迎来到乐码范");
}
sayHello();

还有更厉害的试验，拷贝下面代码到Console里面试一试？

function Person(firstName, lastName, age) {
  this.firstName = firstName;
  this.lastName = lastName;
  this.age = age;
}

var family = {};
family.mother = new Person("Susan", "Doyle", 32);
family.father = new Person("John", "Doyle", 33);
family.daughter = new Person("Lily", "Doyle", 5);
family.son = new Person("Mike", "Doyle", 8);

console.table(family, ["firstName", "lastName", "age"]);

Console虽然有一个独立的面板，但其实你仔细观察了的话，你会发现其它的面板都可以把Console面板调出来。使用Console，你不仅仅可以试验你的JavaScript代码，你也可以尝试对当前页面进行DOM操作，或对页面上的JS对象进行操作，十分方便。

可以用左上角的三个点按钮，控制Console的显示或关闭，也可以直接用快捷键Esc来开或关闭。

你可以尝试一下下面的代码看看结果是什么？

document.getElementsByTagName('div');

Console里面的内容，可以在console里面鼠标右键菜单Clear console来清除。多多尝试，熟能生巧！