JS实现对象深度冻结

1. 使用 const 定义一个对象

const api = {
        url: '127.0.0.1',
        post: 9090,
        obj: {
            arr: ['1', '2', '3']
        }
    }

2. 执行一下以下代码

	 api.post = 8080
     console.log(api,"api"); // 结果为 {url: '127.0.0.1', post: 8080} 'api'
    /**
    * 由此可见,由 const 定义的引用类型函数 是可以改变的，那么怎么解决这个问题呢,接下来用到了对象冻结
    */

3. 使用 Object.freeze 进行冻结

	Object.freeze(api);
    api.post = 8080
    api.obj.arr = []
    console.log(api,"api"); //打印结果为 {url: '127.0.0.1', post: 9090, obj: {arr:[]}} 'api'
   // post 没有被更改但是obj中的arr还是被更改了,说明freeze只能冻结一层,所以这里就需要写一个函数来进行操作

4. 编写方法解决问题

	function objFreeze(obj) {
        // 判断是否为已经被冻结的对象，如果是则直接返回该对象
        if (Object.isFrozen(obj)) {
            return obj;
        }
        // 遍历获取到的对象key,判断是否为 object 类型 如果是则递归执行此函数
        Object.keys(obj).forEach(item => {
            typeof obj[item] === "object" ? objFreeze(obj[item]) : obj[item];
        })
        return Object.freeze(obj);
    }

    objFreeze(api);
    api.post = 8080
    api.obj.arr = []
    console.log(api, "api"); // 结果全都未被修改 ,说明函数编写成功 {url: '127.0.0.1', post: 9090, obj: { arr: (3) ['1', '2', '3']}} 'api'