js創建對象的三種方式

 <script>
        //創建對象的三種方式
        // 1.利用對象字面量(傳說中的大括號)創建對象 

        var obj1 = {
            uname: 'ash',
            age: 18,
            sex: "女",
            sayhi: function() {
                console.log("hello kitty");

            }
        }

        //訪問屬性的兩種方法
        console.log(obj1.uname);
        console.log(obj1[`age`]);

        //調用對象的方法
        obj1.sayhi();


        // 創建對象的第二種方式,用new 關鍵字
        var obj2 = new Object();
        //追加屬性和方法
        obj2.uname = '小明';
        obj2.age = 20;
        obj2.sex = "男";
        obj2.sayHi = function() {
            console.log("hi~");
        }
        console.log(obj2.age);
        console.log(obj2[`age`]);
        obj2.sayHi();


        //    以上兩種方法創建對象一次只能創建一個，用構造函數可以多次創建對象
        // 創建對象的第三種方式,用構造函數
        function Star(uname, age, sex) {
            this.uname = uname; //構造函數里面一定要用到this關鍵字 ，表示當前對象
            this.age = age;
            this.sex = sex;
            this.sing = function(ge) {
                console.log(uname + "的主打歌 " + ge);

            }
        }

        var LDH = new Star("劉德華", 20, "男");
        console.log(LDH.uname);
        console.log(LDH.age);
        LDH.sing("冰雨");

        /* new一個對象的執行過程：
        1.創建一個新對象
        2.this指向這個對象
        3.形參為這個對象的屬性和方法賦值
        4.返回這個對象，所以構造函數里面不需要return */

        var YBN = new Star("姚貝娜", 21, "女"); //new出一個對象
        YBN.sing("隨他吧");
    </script>

 

如何遍歷這個對象的屬性和值呢？用for in 循環

<script>
        // 首先，我用構造函數創建對象
        function Star(uname, age, sex) {
            this.uname = uname;
            this.age = age;
            this.sex = sex;
            this.sing = function(ge) {
                console.log(uname + "的主打歌" + ge);

            }

        }
        var GLN = new Star("龔琳娜", 30, "女");
        //現在來遍歷龔琳娜的屬性
        for (const key in GLN) {
            console.log(GLN.uname + "的屬性有" + key);
            console.log(GLN.uname + "的值有" + GLN[key]);
        }
    </script>

注意，key只是屬性，obj[key] 才是值