原文:http://www.mariusschulz.com/2013/11/13/advanced-javascript-debugging-with-consoletable

本文只是简单翻译,部分不重要部分略去,请原谅。

通过console.log()打印数组

试想一下,假如你创建了一个编程语言以及其文件后缀名列表:

var languages = [{ name: "JavaScript", fileExtension: ".js" },{ name: "TypeScript", fileExtension: ".ts" },{ name: "CoffeeScript", fileExtension: ".coffee" }
];console.log(languages);

console.log()会显示如下信息:

该树视图对于调试是非常有用的,但我们不得不手动打开每个折叠的对象来查看,比较麻烦。我们可以使用console.table()得到更好的体验。

通过console.table()打印数组

现在我们使用console.table()进行打印。

console.table(languages);

你可以看到如下表格:

整齐漂亮,不是么?

当然表单最适合表单数据呈现。如果每个对象都拥有不同的结构,那么最后会发现有很多单元是undefined。尽管如此,属性值都是整齐排列的,并给你很好的概述。

通过console.table()打印对象

实际上console.table()还可以打印对象:

var languages = {csharp: { name: "C#", paradigm: "object-oriented" },fsharp: { name: "F#", paradigm: "functional" }
};console.table(languages);

过滤显示的属性

如果你想限定每一列是特定的属性,你还可以将他们的键作为一个数组,传给console.table(),作为其第二个参数:

// Multiple property keys
console.table(languages, ["name", "paradigm"]);

如果只是想显示一个属性,则传字符串就足够了:

// A single property key
console.table(languages, "name");

高级Javascript调试——console.table()相关推荐

  1. Javascript高级调试——console.table()

    原文:http://www.mariusschulz.com/2013/11/13/advanced-javascript-debugging-with-consoletable 本文只是简单翻译,部 ...

  2. 浏览器调试 console.table() 方法,方便查看json和数组数据内容

    console.table() 好用的方法 刚发现一个好用的console方法 table(),可以把数组和json 数据以 table 方式展示 还可以展示对象属性 如: 这是 table 展示的内 ...

  3. 使用console.table()调试javascript

    原文地址:http://www.mariusschulz.com/2013/11/13/advanced-javascript-debugging-with-consoletable 可能你已经习惯了 ...

  4. JavaScript 控制台(console)调试技巧

    一.简单理解 Console是用于显示JS和DOM对象信息的单独窗口.在浏览器中按F12调出的调试窗口中有一个控制台选项或console选项. 二.支持console的浏览器 Chrome和FireF ...

  5. Javascript调试命令——你只会Console.log() ?

    Javascript调试命令--你只会Console.log() ? Console 对象提供对浏览器控制台的接入(如:Firefox 的 Web Console).不同浏览器上它的工作方式是不一样的 ...

  6. Vue.js 父子组件通信的十种方式;告诉世界前端也能做 AI;你可能不知道的14个JavaScript调试技巧...

    记得点击文章末尾的"阅读原文"查看哟~ 下面先一起看下本周的摘要吧~ 想了解老用户如何参与阿里云双十一1折拼团特惠主机的,可以看第二条推送,文中提供了两种方法~,一起看看本周有哪些 ...

  7. javascript调试_如何提高JavaScript调试技能

    javascript调试 Almost all software developers who have written even a few lines of code for the Web ha ...

  8. Javascript调试技巧整理

    整理一下网上看到的实用调试技巧! 1. 不要使用alert 首先,alert只能打印出字符串,如果打印的对象不是String,则会调用toString()方法将该对象转成字符串(比如转成[object ...

  9. JavaScript 调试建议和技巧

    浏览器开发者工具 我个人最喜欢Chrome开发者工具.虽然Safari和Firefox无法达到Chrome那么高的标准,但它们也在逐渐改善.在Firefox中,可以将Firebug和Firefox开发 ...

最新文章

  1. 设计模式-工厂模式学习(初级)
  2. 争对让望对思野葛对山栀注解_笠翁对韵.支_李召洋、于婷、杨盼兮、于婷_高音质在线试听_笠翁对韵.支歌词|歌曲下载_酷狗音乐...
  3. OpenCV中的模板匹配/Filter2d
  4. 基于Linux的 Open×××网络之网络架构应用实例
  5. uva 10026 Shoemaker's Problem(排序)
  6. c ++类成员函数_C ++编程中的数据成员和成员函数
  7. unef螺纹_硬料怎么车螺纹?一文了解螺纹的分类及其刀具选择
  8. AudioContext
  9. Win8系统如何关闭用户账户控制UAC
  10. A Hierarchical Reinforced Sequence Operation Method for Unsupervised Text Style Transfer
  11. java.io.StreamCorruptedException: invalid type code: AC错误的解决方法
  12. Missing artifact jdk.tools:jdk.tools:jar:1.8报错
  13. html中的form是空标签么,关于html 中form表单的内标签和使用
  14. 软件开发文档-详细设计文档
  15. 小型超市管理系统.c
  16. 计算机网络故障检测,计算机网络故障处理
  17. 热销超极本iFunk翼S到底怎么样?
  18. 对Carrier IQ木马的综合分析报告
  19. Essential Google Cloud Infrastructure: Foundation
  20. 一台计算机连接两个投影,事实:如何将两个外接显示器连接到笔记本电脑以同时实现三个屏幕?...

热门文章

  1. android 7 apk 安装程序,Android安装apk文件并适配Android 7.0详解
  2. linux上c语言hdc句柄,控制台窗口的绘图
  3. springboot整合freemarker中文乱码
  4. 解决easyui textarea 值不显示及获取textarea的值
  5. VB 感染EXE 程序病毒源码
  6. 自动画线指柡(主图)
  7. 随手刷屏的波士顿动力机器人,用3D打印解决了哪些问题
  8. 记一次微信H5全屏播放视频的总结
  9. iOS开发之使用Git的基本使用(二)
  10. Memcached 1.4.22安装和配置