PHP print_r的函数很好用,可以用来打印数组、对象等的结构与数据,可惜JavaScript并没有原生提供类似的函数。不过我们可以试着自己来实现这个函数,下面提供一些方法与思路。

方法一

function print_r(theObj) {
var retStr = '';
if (typeof theObj == 'object') {
retStr += '<div style="font-family:Tahoma; font-size:7pt;">';
for (var p in theObj) {
if (typeof theObj[p] == 'object') {
retStr += '<div><b>['+p+'] => ' + typeof(theObj) + '</b></div>';
retStr += '<div style="padding-left:25px;">' + print_r(theObj[p]) + '</div>';
} else {
retStr += '<div>['+p+'] => <b>' + theObj[p] + '</b></div>';
}
}
retStr += '</div>';
}
return retStr;
}

方法二

$(document).ready(function(){
$('#btn').click(function(){
var jsonStr = $('#jsonData').val();
var json = eval('('+jsonStr+')');
(function(){
var print_r = function(o, depth) {
var result = '';
depth || (depth=1);
var indent = new Array(4*depth+1).join(' ');
var indentNext = new Array(4*(depth+1)+1).join(' ');
var indentNextTwo = new Array(4*(depth+2)+1).join(' ');
var tmp = '';
var type = typeof o;
switch(type) {
case 'string':
case 'number':
case 'boolean':
case 'undefined':
case 'function':
tmp += indent + indentNext + o + "\n";
break;
case 'object':
default:
for(var key in o) {
tmp += indentNextTwo + '[' + key + '] = ';
tmp += print_r(o[key], (depth+1));
}
}
result += type + "\n";
result += indentNext + '(' + "\n";
result += tmp;
result += indentNext + ')' + "\n";
return result;
};
alert(print_r(json));
}(json));
});
});

方法三

print_r:function(theObj) {
var retStr = '';
if (typeof theObj == 'object'||typeof theObj == 'array') {
retStr += '<div style="font-family:Tahoma; font-size:7pt;">';
for (var p in theObj) {
if (typeof theObj[p] == 'object' || typeof theObj[p] == 'array') {
retStr += '<div><b>['+p+'] => ' + typeof(theObj) + '</b></div>';
retStr += '<div style="padding-left:25px;">' + XFUPLOAD.Tools.print_r(theObj[p]) + '</div>';
} else {
retStr += '<div>['+p+'] => <b>' + theObj[p] + '</b></div>';
}
}
retStr += '</div>';
}
$("body").append(retStr);
}

用JavaScript写一个类似PHP print_r的函数的更多相关文章

  1. 怎么用JavaScript写一个区块链?

    几乎所有语言都可以编写区块链开发程序.那么如何用JavaScript写一个区块链?以下我将要用JavaScript来创建1个简单的区块链来演示它们的内部到底是怎样工作的.我将会称作SavjeeCoin ...

  2. 写一个类似淘宝的ios app需要用到哪些技术?

    写一个类似淘宝的ios app需要用到哪些技术? 让我想起了有人私信我,说不缺钱,做个类似知乎的东西,包括加运营,需要多少钱. 扯淡结束,正好最近看了一点这方面的东西,也许对题主来说有点帮助. 手机淘 ...

  3. vnpy源码阅读学习(4):自己写一个类似vnpy的UI框架

    自己写一个类似vnpy的界面框架 概述 通过之前3次对vnpy的界面代码的研究,我们去模仿做一个vn.py的大框架.巩固一下PyQt5的学习. 这部分的代码相对来说没有难度和深度,基本上就是把PyQt ...

  4. JavaScript写一个连连看的游戏

    天天看到别人玩连连看, 表示没有认真玩过, 不就把两个一样的图片连接在一起么, 我自己写一个都可以呢. 使用Javascript写了一个, 托管到github, 在线DEMO地址查看:打开 最终的效果 ...

  5. 用JavaScript写一个区块链

    几乎每个人都听说过像比特币和以太币这样的加密货币,但是只有极少数人懂得隐藏在它们背后的技术.在这篇博客中,我将会用JavaScript来创建一个简单的区块链来演示它们的内部究竟是如何工作的.我将会称之 ...

  6. 用javascript写一个前端等待控件

    前端等待控件有啥新奇的?什么jquery啦,第三方控件啦,好多好多,信手拈来. 因为项目使用了bootstrap的原因,不想轻易使用第三方,怕不兼容.自己写一个. 技术点包括动态加载CSS,javas ...

  7. 用javascript写一个emoji表情插件

    概述 以我们写的这个emoji插件为例,网上已经有一些相关的插件了,但你总感觉有些部分的需求不能被满足(如:可以自行添加新的表情包而不用去改源代码等等) 详细 代码下载:http://www.demo ...

  8. javascript : 写一个类似于 jquery css() 的方法

    我们知道,jquery css() 方法可以很方便的更改DOM的样式. 但从原理上,这个并不复杂,我们完全可以自己写一个. 上代码. updateDOMStyle(DOM, obj){ Object. ...

  9. 用JavaScript写一个简单的倒计时,可以应用在发送短信验证码的“59秒后重新发送验证短信”

    倒计时——从10倒数到0,点击按钮会还原倒计时 <body> <!-- 将textvalue值设为10,从10倒数 --> <input type="text& ...

随机推荐

  1. 带cookie请求数据

    经常会用到一些采集网上的资源,普通网站很好采,get_file_contents()/c_url(). 有的网站会有登陆后才能采集,需要带cookie请求获取(登陆网站相同方法),下面记录一下使用方法 ...

  2. 抽象类实验:SIM卡抽象

    抽象SIM: package sim_package; public abstract class SIM { public abstract String giveNumber(); public ...

  3. LINQ巩固

    LINQ巩固 LINQ过滤运算符 Where 基于谓词函数过滤值 测试例子如下: public class TestModel { public string Name { get; set; } p ...

  4. FTP 主动模式与被动模式

    项目中涉及到媒资传输的地方,均有ftp应用,而关于媒资传输故障的排查中,FTP主被动模式问题占了较高比例,但又容易被忽略, 特此收集相关资料介绍,同时整理了如何通wget.tcpdum分辨FTP的主被 ...

  5. 20145202马超《JAVA》预备作业3

    虚拟机的安装[http://www.cnblogs.com/tuolemi/p/5861062.html] Linux命令[http://www.cnblogs.com/tuolemi/p/58781 ...

  6. LeetCode:3.Longest Substring Without Repeating Characters

    思路:看到题目首先想到最大字符串匹配KMP算法 public static int lengthOfLongestSubstring(String s) { int maxLength = 0; St ...

  7. 26、js阶段性复习

    1.一元运算符 Operator + 可用于将变量转换为数字: <!DOCTYPE html> <html> <body> <p> typeof 操作符 ...

  8. vue2.0 watch

    类型:string | Function | Object vue官网解释: 一个对象,键是需要观察的表达式,值是对应回调函数.值也可以是方法名,或者包含选项的对象.Vue 实例将会在实例化时调用 $ ...

  9. jmeter3.2版本如何进行webservice接口功能测试

    jmeter3.2版本之后就没有SOAP/XML-RPC Request插件了,所以没办法直接进行webservice接口的测试. 原理上: Web service一般就是用SOAP协议通过HTTP来 ...

  10. 【紫书】(UVa12563)Jin Ge Jin Qu hao

    继续战dp.不提. 题意分析 这题说白了就是一条01背包问题,因为对于给定的秒数你只要-1s(emmmmm)然后就能当01背包做了——那1s送给劲歌金曲(?).比较好玩的是这里面dp状态的保存——因为 ...