JavaScript——Object方法

一、Object原型方法

• hasOwnproperty()：用于判断某个对象是否具有某个自带属性。

自带属性：指的是自身就自有的，而非继承来的；

对象.hasOwnProperty(非继承属性)  // 返回布尔值，true表示是，false表示否

• isPrototypeOf()：用于判断一个对象是否在另一个对象的原型链上。

对象a.isPrototypeOf(对象b)   // 判断对象a是否在对象b的原型链上，返回布尔值

• propertyIsEnumerable()：用于判断是否可以从对象中遍历得到某个属性。

对象.propertyIsEnumerable(属性名)  // 返回布尔值

• toString()：用于将对象转成字符串。

对象.toString()  // 返回'[object Object]'

• toLocaleString和valueOf没有实际的效果，是为了让子原型能具备这些方法，来实现不同类型数据的功能；toLocaleString给不同的数据调用会得到不同的数据

// 对象调用
var obj = {name: '张三', age: 123456}
console.log( obj.toLocaleString() ); // [object Object]
// 字符串调用
var str = 'abcdefg'
console.log( str.toLocaleString() );  // abcdefg
// 数字调用
var num = 123456789
console.log( num.toLocaleString() ); // 123,456,789
// 布尔值调用
var bool = true
console.log( bool.toLocaleString() ); // true
// 时间日期对象调用
var date = newDate()
console.log( date.toLocaleString() ); // 2022/11/4 09:20:01

只有数字和时间日期对象调用的时候，能起到作用，其他类型的数据调用后，会默认调用toString方法转成字符串而已。valueOf给不同类型的对象调用功能是不同的：
// 对象调用
var obj = {name: '张三', age: 123456}
console.log( obj.valueOf() ); // {name: '张三', age: 123456}
// 字符串调用
var str = newString('abcdefg')
console.log( str.valueOf() );  // abcdefg
// 数字调用
var num = newNumber(123456789)
console.log( num.valueOf() ); // 123456789
// 布尔值调用
var bool = newBoolean(true)
console.log( bool.valueOf() ); // true
// 时间日期对象调用
var date = newDate()
console.log( date.valueOf() ); // 1667525014847
时间日期对象调用能获取到时间戳，其他类型的对象调用，会得到具体的值，相当于console.log(数组/对象)的值

二、Object方法

• assgin()：用于将一个对象中课遍历的属性复制到另外一个目标对象中，返回目标对象。

var 新目标对象 = Object.assign(原目标对象, 被复制的对象)
// 通常用于做浅克隆，将一个对象中的属性复制在另一个空对象中。

• create()：用于创建一个对象，并指定这个对象的原型。

var 对象 = Object.create(指定的原型对象, { 对象键值对的描述 })   // 返回创建好的对象

• defineProperties()：用于给对象添加或修改一个属性。

Object.defineProperties(对象, {对象键值对的描述})  // 返回处理后的对象

• defineProperty()：用于监视对象某个属性被访问或被修改的操作。

Object.defineProperty(对象, 属性名, {
    // 对象属性的描述
    writable: false,  // 属性是否可修改
    enumerable: true, // 属性是否可遍历
    configurable: false, // 属性是否可删除
//数据劫持：当访问对象属性或设置对象属性时，会先执行一段代码
    get: undefined, // 访问属性值的时候执行什么程序
    set: undefined // 设置属性值的时候执行什么程序
})

• entries()：用于将对象中可遍历的键值对组成一个数组并返回。

Object.entries(对象) // 返回数组

• fromEntries()：跟entries的作用相反，将一个map格式的数组（多个键值对组成的数组）转成一个对象。

Object.fromEntries(map格式的数据) // 返回键值对组成的对象

• freeze()：用于冻结一个对象，让对象不能新增、不能修改、不能删除、不能改原型，不能改属性的特性。

var 对象 = Object.freeze(对象) // 返回被冻结的对象

• getOwnPropertyDescriptors()：获取对象中某个属性对应的描述对象。

• getOwnPropertySymbols()：将对象中所有symbol属性，组成一个数组。

• getPrototypeOf()：获取对象的原型对象。

• hasOwn():判断一个属性是否属于某个对象，而不是被继承来的。跟hasOwnProperty的功能一样。

• is()：用来判断两个数据是否相等，但是跟`==`和`===`都不一样，基本类型数据，判断数据看起来是否相等，引用数据类型比较地址跟`===`一样。

Object.is(数据1, 数据2) // 返回布尔值

• isExtensible()：用于判断一个对象是否可扩展（是否可以给对象添加属性）。冻结对象、密封对象不可以扩展。

• isFrozen()：用于判断一个对象是否被冻结。

• preventExtensions()：用于将一个对象变得不可扩展。

• setPrototypeOf()：用于给对象设置原型。

• seal()：封闭一个对象，让对象不能添加新属性、不能删除键值对。

Object.seal(要被封闭的对象) // 返回被封闭的对象

• keys()：获取对象中所有键组成的数组。

• values()：获取对象中所有值组成的数组。

三、ES6的对象操作

• Symbol数据类型：

是ES6中新增的类型，该类型中的内容都是独一无二的，具有唯一性。symbol的主要作用就是创建对象中独一无二的键，可以从根本上防止对象中的键重复。对象中的键除了是字符串以外，还可以是symbol数据。

var s = Symbol('name')
var s1 = Symbol('name')
console.log(s == s1);   // false

注意：

1）在ES6之前，对象中的键名只能使用字符串，在ES6之后，对象中的键名可以使用字符串和Symbol类型

2）如果symbol的参数是一个对象，会默认调用对象的toString方法得到字符串

3）当使用Symbol数据类型来作为对象的键名时；对象的键名存放的是引用地址，当想要获取对象中Symbol数据类型的值时，也是通过引用地址来查找

4）Symbol没有隐式转换，但可以强制转换成字符串和布尔值

5）通过description属性可以获取当前symbol类型中的内容

var s = Symbol('abc')
console.log(s.description) // abc

• Reflect：检测当前对象中的内容是否操作成功

• Reflect.set(对象，键，值)：添加或修改对象中的内容，返回bool值

• Reflect.get(对象，键)：获取对象中指定键所对应的内容，返回值或undfined

• Reflect.deleteProperty(对象，键)：删除对象中指定的键值对，返回bool值

//添加
var bool1=Reflect.set(o1,"age",12)
console.log(bool1) //false
//删除
var bool2=Reflect.deleteProperty(o1,"name")
console.log(boo12)
//访问
var bool3=Reflect.get(o1, "name")
console.log(bool3) //张三
var o2={
    name:"李四"
}
//添加
var bool1=Reflect.set(o2, "age",12)
console.log(bool1)//true
//删除
var bool2=Reflect.deleteProperty(o2,"name")
console.log(bool2) //true

• Proxy构造函数：专门用来监听/劫持对象中的操作；当访问，设置，删除对象键值对的时候会被监视到，和defineProoerty的功能是一样的。

var p1=newProxy(对象,{
    get(对象，键){ },
    set(对象,键,值){ },
    deleteProperty(对象,键){ }
})

注意：

1）vue2中数据和视图双向绑定使用的defineProperty，动态给对象添加属性和删除属性都是不能双向绑定的

//数据的双向绑定
var o={
    age:12
}
//当input值修改时，让o.age的值也修改
//当o.age的值修改时，让input的值也修改
var input =document.querySelector("input")
input.oninput=function(){
    o.age=input.value
}
Object.defineProperty(o,"age",{
    set(val){
        input.value=val
    },
    get(){
        return input.value
    }
})

2）vue3中数据和视图双向绑定使用proxy，动态给对象添加属性和删除属性都是可以双向绑定的

var o={
    age:12
}
//当input值修改时，让o.age的值也修改
//当o.age的值修改时，让input的值也修改
var input =document.querySelector("input")
input.oninput=function(){
    p1.age=input.value
}
var p1=new Proxy(o,{
    get(obj,key){
        return obj[key]
    },
    set(obj,key,value){
        obj[key]=value
        input.value=value
    },
    deleteProperty(obj,key){
        delete obj[key]
    }
})