console.log 在js、React Native (Rn)中的开关设计

最新推荐文章于 2025-05-17 13:39:54 发布

huch_shyh

最新推荐文章于 2025-05-17 13:39:54 发布

阅读量4.2k

点赞数 2

CC 4.0 BY-SA版权

分类专栏：技术总结文章标签： console.log在js、Rn中控制开关

本文链接：https://blog.youkuaiyun.com/u012982629/article/details/80410183

技术总结专栏收录该内容

5 篇文章

订阅专栏

本文分享了一种在不同开发环境中实现日志开关的技术方案，包括Android、ReactNative及React应用中如何通过全局变量控制日志输出。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

为啥会写这个题目呢，也是来自于自己在开发场景转换时遇到一个性能优化点。因为我之前是做Android开发的，当时设计Log开关的时候，是去写一个LogUtils工具类，里面去重写Log类的各个方法，然后里面的关键代码

if (BuildConfig.DEBUG) {
     //todo
}

因为在写Android代码时，用工具类LogUtils很方便，会自动提示 import，所以编码比较便捷。

后面我又加入了React Native的大军的开发，因为在写Rn的时候大多数是用React js的，这个时候如果还用之前Android那套思路来写开关的话，问题是没有的，但是每个页面都去import这就有点受不了。后面了解React Native是有global全局变量的，那么自然想到了下面的代码：

if (!SHOW_LOG) {
        global.console = {
            info: () => {},
            log: () => {},
            warn: () => {},
            debug: () => {},
            error: () => {},
        };
    }

思路就是控制变量SHOW_LOG的 true/false来是否重写系统的console对象。

再后面我又开始负责写前后端分离的React项目了，那么这时候再去看这个问题，我自然想到html中的window对象，全局变量是 window 对象的属性，全局函数是 window 对象的方法。然后就想到了后面的代码：
//控制log开关

const ISDEBU=true
ISDEBU || (()=>{
    window.console={
        info: () => {},
        log: () => {},
        warn: () => {},
        debug: () => {},
        error: () => {},
    };
})()

嗯哼，这个小技术点就分享到这里了。