原文: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");

出处:https://www.cnblogs.com/justany/p/3429097.html

Javascript高级调试——console.table()的更多相关文章

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

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

  2. javascript 调试 & console.table()

    通过console.table()打印数组.对象 一般我们都是通过console.log()打印数组或对象,但console.table()打印数组.对象更直观: console.table(empi ...

  3. 读javascript高级程序设计08-引用类型之Global、Math、String

    一.Global 所有在全局作用域定义的属性和方法,都属于Global对象. 1.URI编码: encodeURI():主要用于对整个URI编码.它不会对本身属于URI的特殊字符进行编码. encod ...

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

    或许你已经习惯了console.log()来调试js,非常使用,但是今天微博看到console.table()调试javascript,和console.log()类似,主要区别在于: 主要用来输出对 ...

  5. JavaScript常见调试方法

    编辑导语:javascript调试方法,常见使用alert和console来定位出错和输出的结果是否是想要的,在chrome中,还可以使用断点来看运行的情况等,本文介绍了比较全面的调试方法,你知道co ...

  6. js调试console.log使用总结图解

    一 实例 打印字符串和对象: 可展开对象查看内部情况: 看一下console对象本身的定义情况: 输出对象情况: utag对象所在文件: 输出对象: 二 Console.log 总结 1   如果你j ...

  7. 【调试】js调试console.log使用总结图解(重要)

    0.介绍 先上图:不知道有多少人发现,在浏览器开发工具的“Console”上的百度首页的关于百度招聘的信息: 今天要给大家介绍的就是是Web前端调试工具中的Console面板,应该说只要是个浏览器就会 ...

  8. 带你重拾JavaScript(2)之console的你所不知道的功能

    JavaScript最常用的调试工具就是console.info()了.console是浏览器中window对象的属性之一,由浏览器对象模型(BOM)提供,作用是访问浏览器控制台,你可以通过conso ...

  9. 读书笔记(02) - 可维护性 - JavaScript高级程序设计

    编写可维护性代码 可维护的代码遵循原则: 可理解性 (方便他人理解) 直观性 (一眼明了) 可适应性 (数据变化无需重写方法) 可扩展性 (应对未来需求扩展,要求较高) 可调试性 (错误处理方便定位) ...

随机推荐

  1. do while

    do while结构的基本原理和while结构是基本相同的,但是它保证循环体至少被执行一次.因为它是先执行代码,后判断条件,如果条件为真,继续循环.

  2. 网口扫盲三:以太网芯片MAC和PHY的关系(转)

      问:如何实现单片以太网微控制器? 答:诀窍是将微控制器.以太网媒体接入控制器(MAC)和物理接口收发器(PHY)整合进同一芯片,这样能去掉许多外接元器件.这种方案可使MAC和PHY实现很好的匹配, ...

  3. BeanUtils出现Java.lang.NoClassDefFoundError解决

    问题描述: javaWeb项目中导入了BeanUtils的两个包,但是还是出现Java.lang.NoClassDefFoundError: org/apache/commons/beanutils/ ...

  4. 牛客多校第四场 F Beautiful Garden

    链接:https://www.nowcoder.com/acm/contest/142/F来源:牛客网 题目描述 There's a beautiful garden whose size is n ...

  5. 文件操作---with语句

    with语句 为了避免打开文件后忘记关闭,可以通过管理上下文,即: with open('file','r','encoding='uth-8'') as f: #f为文件句柄 for line in ...

  6. oracle语句优化

    摘录来自https://blog.csdn.net/sap_jack/article/details/3766703 1.选用适合的Oracle优化器 Oracle的优化器共有3种: a.RULE(基 ...

  7. day55 jQuery 练习

    <!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8&qu ...

  8. LimeSDR Getting Started Quickly | LimeSDR上手指南

    0x00 概览 LimeSDR部分特性: USB 3.0 : 4 x Tx 发射天线接口 6 x Rx 接收天线接口: 可用于Wi-Fi, GSM, UMTS, LTE, LoRa, Bluetoot ...

  9. 【转载】 火爆的996.ICU项目正在酝酿开源许可证 禁止996公司使用

    原文地址: https://www.cnbeta.com/articles/tech/832449.htm ---------------------------------------------- ...

  10. 复杂的动态布尔表达式性能评估(2)--Groovy实现

    前言: 规则引擎中, 往往涉及到多个条件构成了复杂布尔表达式的计算. 对于这类布尔表达式, 一是动态可变的(取决于运营人员的设定), 二是其表达式往往很复杂. 如何快速的计算其表达式的值, 该系列文章 ...