目前网上还没有类似的教程哦。 Console作为日志输出调试的功能还是很强大的。可以打印正常的日志信息，错误信息(log,info,warn,error)等等，还可以详细详细显示函数调用栈，信息的输出函数名以及代码位置，功能可谓非常强大。 但是有个问题就是无法根据日志的等级来自由控制输出权限。比如我设置一个等级，只能输出warn和error这样。虽然有可能发布的时候，会把Console基本有从代码中去掉，但是调试的时候有时也需要调整等级了。比如想暂时把log给屏蔽掉，只输出info或者warn以上信息。
最开始是想写个Log日志类来扩展Console的，增加控制日志等级之类的功能。写好之后，发现一个很郁闷的问题，那就是自己的日志输出，远远没有Console自带的强大。因为Console输出信息的时候，可以把当前类和那一行代码的信息给打印出来。这个很强大，对于调试非常有用，而自己写的Log没有这个功能。 用自己的Log进行扩展，则无法显示出真实的代码路径，变成自己写的Log路径了。看下图 当然这个输出日志路径是方便本地调试看。如果需要把日志错误等信息收集发给服务器，自定义扩展Log还是可行的。 针对这样的情况，我对Console对象进行了扩展。增加了相应的功能。
演示代码为TypeScript的代码。后面会给出完整的TypeScript和JavaScript的代码。
首先是准备增加等级控制，比如我可以调整日志的输出级别，来决定trace，log,info,error等输出。原理其实很简单，利用原型重写对应的方法。根据等级，把小于日志输出等级的方法设置为一个空方法，什么也不做，这样就无法输出信息了。 对输出方法进行分级别
/** 调试级别，trace函数路径 **/ static TRACE:number = 0; /** 普通日志级别 **/ static LOG:number = 1; /** 信息日志级别 **/ static INFO:number = 2; /** 警告日志级别 **/ static WARN:number = 3; /** 错误日志级别 **/ static ERROR:number = 4; /** 需要屏蔽覆盖的方法名 **/ private static funNames:string[] = ["trace","log","info","warn","error"];实现过程是这样的： 先把console原来的trace，log等function给存放起来，当进行等级控制时，先把所有的方法都设置为空方法，然后把大于等于日志级别的方法给恢复过来。
//设置回最初的方法 for(var i:number = 0; i < this.funNames.length; i++) { //定义个空方法屏蔽掉 console[this.funNames[i]] = this.emptyFun; } //根据this.$level来还原输出方法 for(var i:number = this.$level; i < this.funNames.length; i++) { //还原成最初的方法 console[this.funNames[i]] = this.funList[i]; }原理就是这么简单，然后进行包装的代码就会稍微多一点。看输出效果。
// //开启扩展日志 asf.ConsolePlus.init(); console.log("扩展日志的正常模式"); console.log("log的信息"); console.info("info的信息"); console.warn("warn的信息"); // console.error("error的信息"); console.log("把日志等级调整为WANR"); //设置日志等级，warn，就只有warn的信息才能输出 asf.ConsolePlus.setLevel(asf.ConsolePlus.WARN); console.log("log的信息"); console.info("info的信息"); console.warn("warn的信息"); console.error("error的信息");输出结果是这样的 可以看到把日志等级调整为WARN之后，就无法看到log和info的信息了。
这个实现其实主要是后期扩展，需要把日志传给服务器或者其他调试端的时候才需要的。主要原理其实是在原有的log，info等方法的后面增加自己的信息（当然也可以发给服务器）。类似java的AOP面向切面编程。
/** * 创建扩展函数 * @param oldFun 原有的函数 * @param funName 函数名称 */ private static createPlusFun(oldFun:Function,funName:string):void { var fun:Function = function (message?: any, ...optionalParams: any[]):void { console.group("[" + funName + "][" + new Date() + "]"); oldFun.apply(console,arguments); console.groupEnd(); } this.funPulsList.push(fun); } asf.ConsolePlus.openConsolePlus(); console.log("log的信息"); console.info("info的信息"); console.warn("warn的信息");前后增加了个组显示的简单扩展，看具体的输出效果。
完整的调试信息代码：
// //开启扩展日志 asf.ConsolePlus.init(); console.log("扩展日志的正常模式"); console.log("log的信息"); console.info("info的信息"); console.warn("warn的信息"); // console.error("error的信息"); console.log("把日志等级调整为WANR"); //设置日志等级，warn，就只有warn的信息才能输出 asf.ConsolePlus.setLevel(asf.ConsolePlus.WARN); console.log("log的信息"); console.info("info的信息"); console.warn("warn的信息"); console.error("error的信息"); //设置回正常的log级别 asf.ConsolePlus.setLevel(asf.ConsolePlus.LOG); console.log("启动Console的扩展模式"); asf.ConsolePlus.openConsolePlus(); console.log("log的信息"); console.info("info的信息"); console.warn("warn的信息"); console.error("error的信息"); //输出扩展模式也支持日志等级的 console.log("Console的扩展模式调整日志级别到warn"); asf.ConsolePlus.setLevel(asf.ConsolePlus.WARN); console.log("log的信息"); console.info("info的信息"); console.warn("warn的信息"); console.error("error的信息"); asf.ConsolePlus.closeConsolePlus(); console.log("1关闭Console的扩展模式，正常输出啦"); //得调级别才能输出log asf.ConsolePlus.setLevel(asf.ConsolePlus.LOG); console.log("2关闭Console的扩展模式，正常输出啦");注意，这个js代码是TypeScript生成的代码，所以有部分会很奇怪。具体我没单独调试运行过，请注意。
var asf; (function (asf) { /** * 输出信息扩展类 * @author sodaChen * Date:2017/2/15 */ var ConsolePlus = (function () { function ConsolePlus() { } ConsolePlus.init = function (isPlusMode) { if (isPlusMode === void 0) { isPlusMode = false; } this.funList = []; this.funPulsList = []; this.emptyFun = function () { }; //存放原来的方法 for (var i = 0; i < this.funNames.length; i++) { this.funList.push(console[this.funNames[i]]); } //生成新的扩展方法 for (var i = 0; i < this.funNames.length; i++) { this.createPlusFun(this.funList[i], this.funNames[i]); } this.setConsoleMode(isPlusMode); }; /** * 设置日志等级，所有大于等于这个日志级别的输出都可以正常输出，小于的则不能进行输出 * @param level */ ConsolePlus.setLevel = function (level) { this.$level = level; this.openConsole(); }; /** * 设置输出模式 * @param isPlusMode 是否为扩展模式 */ ConsolePlus.setConsoleMode = function (isPlusMode) { this.isPlusMode = isPlusMode; if (isPlusMode) this.openConsolePlus(); else this.openConsole(); }; /** * 打开日志 */ ConsolePlus.openConsole = function () { this.closeConsole(); //扩展默认，则调用扩展方法 if (this.isPlusMode) { this.openConsolePlus(); return; } for (var i = this.$level; i < this.funNames.length; i++) { //还原成最初的方法 console[this.funNames[i]] = this.funList[i]; } }; /** * 关闭所有的日志输出 */ ConsolePlus.closeConsole = function () { //设置回最初的方法 for (var i = 0; i < this.funNames.length; i++) { //定义个空方法屏蔽掉 console[this.funNames[i]] = this.emptyFun; } }; /** * 开启日志输出的扩展模式 */ ConsolePlus.openConsolePlus = function () { this.isPlusMode = true; //扩展console的所有方法 for (var i = this.$level; i < this.funNames.length; i++) { console[this.funNames[i]] = this.funPulsList[i]; } }; /** * 关闭日志输出的扩展模式 */ ConsolePlus.closeConsolePlus = function () { this.isPlusMode = false; //还原成原来的方法 this.openConsole(); }; /** * 创建扩展函数 * @param oldFun 原有的函数 * @param funName 函数名称 */ ConsolePlus.createPlusFun = function (oldFun, funName) { var fun = function (message) { var optionalParams = []; for (var _i = 1; _i < arguments.length; _i++) { optionalParams[_i - 1] = arguments[_i]; } console.group("[" + funName + "][" + new Date() + "]"); oldFun.apply(console, arguments); console.groupEnd(); }; this.funPulsList.push(fun); }; /日志级别 /** 调试级别，trace函数路径 **/ ConsolePlus.TRACE = 0; /** 普通日志级别 **/ ConsolePlus.LOG = 1; /** 信息日志级别 **/ ConsolePlus.INFO = 2; /** 警告日志级别 **/ ConsolePlus.WARN = 3; /** 错误日志级别 **/ ConsolePlus.ERROR = 4; /** 默认是最初的日志级别，改变这个值。可以改变日志输出的结果 **/ ConsolePlus.$level = ConsolePlus.LOG; /** 需要屏蔽覆盖的方法名 **/ ConsolePlus.funNames = ["trace", "log", "info", "warn", "error"]; return ConsolePlus; }()); asf.ConsolePlus = ConsolePlus; })(asf || (asf = {}));完整的调试代码可以直接用上面那个ts的调试代码，使用过程是完全一样。(ts生成出来的那部分js也是一样的，不帖了)
