当前位置：网站首页>object. Defineproperty basic usage

object. Defineproperty basic usage

2022-06-12 12:05:00 【Mustang (Mustang)】

object.defineProperty Basic use 

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>

    <script>

/*
 Define a new property for an object or modify an existing property of an object , And return this object 

 grammar ：
　　Object.defineProperty( Parameters 1, Parameters 2, Parameters 3)
　　 Parameters 1： Target audience 

　　 Parameters 2： The name of the attribute to be modified or added 

　　 Parameters 3： Some characteristics of target object properties  ( It's an object )
　　　　　　
　　　　　　 Parameters 1：
　　　　　　　　value: Property value 
　　　　　　 Parameters 2：
　　　　　　　　writable： Whether object property values can be modified   true allow   false Don't allow 
　　　　　　 Parameters 3：
　　　　　　　　configurable: Whether object properties can be deleted  true allow   false Don't allow 
　　　　　　 Parameters 4：
　　　　　　　　enumerable: Whether object properties can be enumerated 
　　　　　　 Parameters 5：
　　　　　　　　get(): Give a property getter Method , This method is triggered when the property value of this object is accessed 
　　　　　　 Parameters 6：
　　　　　　　　set(): Give a property setter Method , This method is triggered when the property value is set 
　*/
//2、value
        // var obj = {};
        // Object.defineProperty(obj, "name", {
        //     value: " Zhang San "
        // })

        // Object.defineProperty(obj, "age", {
        //     value: "28"
        // })

        // console.log(obj)

//3、writable
        // var obj = {};
        // Object.defineProperty(obj, "name", {
        //     value: " Zhang San ",
        //     writable: false// When set to false The property value of the current object cannot be modified 
        // })

        // obj.name = " Li Si "
        // console.log(obj.name)// Zhang San 


        // var obj = {};
        // Object.defineProperty(obj, "name", {
        //     value: " Zhang San ",
        //     writable: true// When set to true The property value of the current object can be modified 
        // })

        // obj.name = " Li Si "
        // console.log(obj.name)// Li Si 

// 4、configurable
        // var obj = {};
        // Object.defineProperty(obj, "name", {
        //     value: " Zhang San ",
        //     configurable: false// When set to false The properties of the object are not allowed to be deleted 
        // })

        // delete obj.name;

        // console.log(obj.name)// Zhang San 

        // var obj = {};
        // Object.defineProperty(obj, "name", {
        //     value: " Zhang San ",
        //     configurable: true// When set to true The properties of the object can be deleted 
        // })

        // delete obj.name;

        // console.log(obj.name)//undefined

// 5、enumerable
        // var obj = { name: " Zhang San ", age: " Li Si " }

        // Object.defineProperty(obj, "name", {
        //     enumerable: false// When set to false The properties of an object cannot be enumerated 
        // })
        // Object.defineProperty(obj, "age", {
        //     enumerable: false
        // })
        // console.log(Object.keys(obj))//[]

        // var obj = { name: " Zhang San ", age: " Li Si " }

        // Object.defineProperty(obj, "name", {
        //     enumerable: true// When set to true The properties of an object can be enumerated 
        // })

        // Object.defineProperty(obj, "age", {
        //     enumerable: true
        // })
        // console.log(Object.keys(obj))//["name",age]

//6、for in  And Object.keys() The difference between 
        // function Person(name, age) {
        //     this.name = name;
        //     this.age = age;
        // }
        // Person.prototype = {
        //     sex: " male "
        // }

        // var man = new Person(" Zhang San ", 18);

        // console.log(Object.keys(man));//["name","age"]

        // for (var key in man) {
        //     console.log(key);//name age sex
        // }

        //  summary ：
        // 　　Object.keys()： Returns an array , The array value is the object's own attribute , Does not include inherited prototype properties 
        // 　　
        // 　　for in : Traversing object enumerable properties , Include own attributes , And properties inherited from the prototype 




// 7、get() && set()

        var obj = { name: " Zhang San " }

        Object.defineProperty(obj, "name", {
            get() {
                console.log(" Was interviewed ")// Triggered when accessed get() Method 

            },
            set(newVal) {
                console.log(" Has been set up " + newVal)// Triggered when set set() Method 
            }
        })
        obj.name// Output ： Was interviewed 
        obj.name = " Li Si ";// Output ： Li Si was set up 
//  Be careful ： When using the get() Methods or set() Method cannot be used value and writable Otherwise, an error will be reported 

    </script>
</body>
</html>
原网站

版权声明
本文为[Mustang (Mustang)]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/163/202206121158414465.html

边栏推荐

猜你喜欢

随机推荐