创建对象使用键值对形式的加深理解

一大早准备继续昨天的内容学，结果上来就被一个细节问题困住两小时，不解决这些细节以后遇到同样会花费精力去解决，现在解决了就当做夯实基础，以后也能快一些，本着本人零基础自学，不懂的问题应该很多，该学就得学，不能马虎略过的心态，虽然会耽搁学习进度，但长远来看应该是有益的，实在解决不了，先做标记，以后再回顾；以此记录自己自学经历

以下为问题

<script>
        function fun() {
            return {
                fun = function () {
                    return fun();
                }
            }
        }
//上面的代码是第二个fun是=   下面的是：
//-------------------------------------------------------------------------------

        
        function fun(n, o) {
            return {
                fun: function (m) {
                    return fun();
                }
            }
        }
    </script>

当鼠标放在fun上时，相同fun的会显示，等号与冒号

当时的疑惑：
为什么同样添加属性，冒号的时候中间的fun跟前后的不是同一个，而等号的时候好像是同一个
为什么冒号的时候，中间的fun不是跟上下两个一样的fun

答案
首先明确{}创建对象的时候，必须要用键值对的形式书写，不能让写=
不然会出现Uncaught SyntaxError: Invalid shorthand property initializer的报错
比如所示

function fun() {
            return {
                fun = function () {
                    return fun();
                }               
            }
        }
console.log(fun())

浏览器会报错Uncaught SyntaxError: Invalid shorthand property initializer

所以一来这个=写法就是错误的，纠结在了其他地方，这个时候编译不会报错，所以根本看不出来错了

在正确的写法里面

function fun1() {
            return {
                fun1: function () {
                    return arguments.callee.name;
                }
            }
        }
console.log(fun1().fun1())

fun1表示的是{}对象里的一个属性，这个属性指向function(){} 所以当fun1()时，返回的是这个对象
要想访问对象里的fun1，要加点 fun1().fun1 再想要执行此时的函数需要再加括号，每一次加的符号都是不一样的意义，要深刻体会 fun1().fun1()此时会执行最里面的function并返回该函数的name，那么此时返回的必然是fun1，问题是现在的fun1是最外面的fun1还是里面对象的fun1，
其实是里面的，因为是里面的函数在调用，为此特加验证，将两个函数分别改名

function fun12() {
            return {
                fun1: function () {
                    return arguments.callee.name;
                }
            }
        }
console.log(fun12().fun1())

此时控制台输出为fun1，验证成功