首页 > 其他分享 >day25 Object方法讲解

day25 Object方法讲解

时间：2022-11-07 22:02:14浏览次数：42  
标签：console log day25 Object 讲解 obj 属性 name

概述 :

Object是所有类的父类 , 也就是说它的方法和属性所有的对象都可以使用 . Object的相关方法和属性是提供给其他对象进行使用的

相关方法和属性

原型方法及属性 (实例方法和属性)

  • hasOwnProperty ( 判断当前对象是否具备这个属性 不会读取原型上的属性 )

let obj = {
    name:'tom',
    age:22
}
function Person(name,age){
    this.name = name
    this.age = age
}
Person.prototype.sex = '男'
let person = new Person('jack',23)
//hasOwnProperty 是判断当前对象是否具备这个属性的,返回值是布尔类型,传入需要判断的属性名
console.log(obj.hasOwnProperty('name')) //true
console.log(person.hasOwnProperty('name'))//true
//hasOwnProperty 不会读取原型上的属性
console.log(person.hasOwnProperty('sex'))//false
  • isPrototypeOf ( 判断对象是否存在于传入对象的原型链上 )
//组合继承
function Son(){
    Person.call(this)//对象冒充继承
}
let person1 = new Person('rose',24)
Son.prototype = person1//原型链继承
let son = new Son()

//组合继承
function Child(){
    Son.call(this)
}
Child.prototype = son
let child = new Child()
//isPrototypeOf是判断当前对象是否处在传入对象的原型链(__proto__)上
console.log(person1.isPrototypeOf(son))//true
console.log(son.isPrototypeOf(child))//true
console.log(person1.isPrototypeOf(child))//true

__defineGetter __定义获取的方法 ( 废弃 , 有替代品 )

__defineSetter__ 定义设置的方法 ( 废弃 , 有替代品 )

__lookupGetter__ 返回定义的获取方法

__lookupSetter__ 返回定义的设置方法

//Getter和Setter是获取和设置 (实际操作的对象和访问的对象不能是一个)
//Getter方法里面返回的数据就是显示的数据,Setter要进行相关设置
let obj = {
    name:'tom',
    age:24
}
//拷贝obj1的内容
let model = Object.assign({}.obj)
obj.__defineGetter__('name',function(){
    console.log('get触发了')
    return model.name
})
obj.__defineSetter__('name',function(alex){
    console.log('sset触发了')
    model.name = alex
})
console.log(obj.name)//get触发了,tom
obj.name='aloha'
console.log(obj.name)//set触发了,get触发了,aloha
//查看Getter和Setter
console.log(obj.__lookupGetter__('name'))//Getter的函数
console.log(obj.__lookupSetter__('name'))//Setter的函数
  • propertyIsEnumerable 判断当前属性是否可枚举 ( 遍历 )

//propertyIsEnumerable 传入一个属性,判断这个属性是否可以枚举
console.log(obj.propertyIsEnumerable('name'))

  • toLocaleString 根据本地格式转为字符串

  • toString 转为字符串

Object.prototype.toString.call(需要查找的变量,(item=>{这个item里面就有对应的类型}))
  • valueOf
//转字符串
console.log(obj.toLocaleString())//本地格式
console.log(obj.toString())
//valueOf 返回对应的值
console.log(obj.valueOf())

原型属性

  • constructor 指向当前对象的构造函数

  • __proto__ 原型隐式指向

静态方法 (Object.方法调用的)

  • Object.is 判断两个对象是否是一个对象 ( 相当于全等=== , 只有NaN和+0-0不同 )

Object.is(NaN,NaN)//true
Object.is(+0,-0)//false
+0 === -0 //true
NaN === NaN //false
  • Object.assign 将后面的对象拷贝到第一个对象中 ( 浅拷贝 ) , 拷贝不了继承属性和不可枚举属性
//浅拷贝 (浅拷贝第一层只拷贝值,第二层拷贝的都是地址)
let obj = {arr:[1,2,3]}
let obj1 = Object.assign(obj,{name:'jack',age:20})
console.log(obj) //{name:'jack',age:20}
console.log(obj == obj1) //true
//拷贝到一个新对象,所以不是一个地址
obj.arr.push(4)
let copyObj = Object.assign({},obj)
console.log(copyObj)//{arr:[1,2,3,4],name:'jack',age:20}
console.log(copyObj == obj)//false
  • Object . create 根据传入的内容创建相关的对象
//它会根据传入的对象创建新的对象,但是跟传入的对象不是同一个
//然后它会将这个创建好的对象指向传入对象的原型上
function Person(name){
    this.name = name
}
let person = new Person('tom')
let createObj = Object.create(person)
console.log(createObj) //tom
console.log(person == createObj)//fasle,创建的对象跟传入的对象不是同一个
手写实现Object.create
function myCreate(o){
    //创建对象
    let obj = new Object()
    //将传入的o加到这个对象的原型上
    obj.__proto__ = o
    return obj
}
let myCreateObj = new myCreate(person)
console.log(myCreateObj)

  • Object.keys 将它可枚举的key全部加入到一个迭代器返回

  • Object.values 将它的value全部加入到一个迭代器返回

  • Object.entries 将它的键值对全部加入到一个迭代器返回

//for in 遍历对象
//for of 遍历对应的迭代器(必须要实现迭代器)
let obj = { name: 'tomCat', number: 5 }
console.log(Object.keys(obj))
console.log(Object.values(obj))
console.log(Object.entries(obj))

  • getPrototypeOf 获取原型

  • setPrototypeOf 设置原型

//Object.setPrototypeOf 设置原型
function Person(){
    this.name='tomCat'
}
let person = new Person()
let protoObj = {age:20,address:'宇宙尽头'}
Object.setPrototypeOf(person,protoObj)//传入需要设置的对象和设置的内容
console.log(person)

//Object.getPrototypeOf 获取原型
console.log(Object.getPrototypeOf(person))//传入需要获取的对象就ok啦

  • freeze 冻结 ( 只能查询 ,不能删除修改增加 )

  • seal 密封 ( 只能查询和修改 , 不能删除和添加新的属性 )

  • preventExtension 不可扩展 ( 不能添加新的属性 ,可以修改删除查询 )

判断是否冻结 , 是否密封 , 是否可扩展 ( 只要冻结了 也就密封了 )

freeze > seal > PreventExtensions ( 冻结必定密封 , 密封必定不可扩展 )

  • Object.isFrozen ( ) 是否冻结

  • Object.isSealed ( ) 是否密封

  • Object.isExtensible ( ) 是否可扩展

let obj = {
    name:'jack',
    age:22,
    sex:'男'
}
Object.freeze(obj)//冻结当前obj对象
//Object.seal(obj)  //密封当前obj对象
//Object.preventExtensions(obj)    //当前obj对象不可扩展
console.log(obj.name)//查
obj.name = 'tomCat'     //改
delete obj.sex         //删
obj.address = '湖南长沙'   //增
for(let key in obj){
    console.log(key) //查
}
//判断当前obj是否冻结 , 是否密封 , 是否可扩展 ( 只要冻结了 也就密封了 )
console.log(Object.isFrozen (obj))
console.log(Object.isSealed (obj))
console.log(Object.isExtensible(obj))

  • getOwnPropertyNames 获取所有的属性名 ( 除symbol的key以外 )

  • getOwnPropertySymbols 获取所有symbol为键的属性名

  • getOwnPropertyDescriptor 获取对应属性的详情 ( 返回属性对象 )

  • getOwnPropertyDescriptors 获取所有属性的详情 ( 返回包含所有属性对象的对象 )

let symbol = new Symbol()
let obj = {
    name:'jack',
    age:20
}
obj[symbol] = '你好'
//获取所有的属性名 ( 除symbol的key以外 ) 传入的是一个对象,返回的是一个字符串数组
let names = Object.getOwnPropertyNames(obj)
console.log(names)
//获取所有symbol为键的属性名 返回symbol数组
let symbols = Object.getOwnPropertySymbols(obj)
console.log(symbols)
//获取对应属性的详情,传入对象和属性 ( 返回属性对象 )
let desc = Object.getOwnPropertyDescriptor(obj,'name')
console.log(desc)
//获取所有属性的详情,传入对象 ( 返回包含所有属性对象的对象 )
let descr = Object.getOwnPropertyDescriptors(obj)
console.log(descr)
  • Object . defineProperty 定义单个属性
let obj = {
    name:'rose'
    sex:'女'
}
Object.defineProperty(obj,'age',{
    configurable:true, //是否可删除,不写默认是false
    enumerable:true,   //是否可枚举(遍历),不写默认是fasle
    value:20,
    writable:true       //是否可修改
})
console.log(obj)//{name:'rose',sex:'女',age:20}
delete obj.sex
for(var key in obj){
    console.log(key)//name,age
}
obj.age = 24
console.log(obj)//{name:'rose',age:24}
属性属性 ( 基础的属性定义 )
configurable:false,
enumerable:false,
value:20,
writable:false
访问器属性 ( 只能给已存在的属性进行访问 )
//(实际操作的对象和访问的对象不能是一个)
configurable:false,
enumerable:false,
get(){}, //value,它把__defineGetter__替换了
set(){}  //writable,它把__defineSetter__替换了
//(实际操作的对象和访问的对象不能是一个)
let obj = {
    name:'alex',
    age:26,
    sex:'女'
}
let model = Object.assign({},obj)
Object.defineProperty(obj,'name',{
    configurable:true,
    enumerable:true,
    get(){
        //获取值的时候调用,它替代了__defineGetter__
       console.log('调用了get') 
       return model.name+00 
    },
    set(v){
        //设置值的时候调用,它替代了__defineSetter__
        console.log('调用了set')
        model.name=v
    }
})
console.log(obj.name)//调用了get,alex00
obj.name = ajax
console.log(obj.name)//调用了set,get,ajax00
  • Object . defineProperties 定义多个属性
//定义多个属性
//(实际操作的对象和访问的对象不能是一个)
let obj = {}
let model = {}
Object.defineProperties(obj,{
    usename:{
        configurable:true,
        enumerable:true,
        get(){
            return model.usename
        },
        set(v){
            model.usename = v
        }
    },
    password:{
        configurable:false,
        enumerable:false,
        get(){
            return model.password
        },
        set(v){
            model.password = v
        }
    }
})
obj.usename = 'alex'
obj.password = 123456
console.log(obj) //{}
console.log(model)//{usename:'alex',password:123456}

总结

  • 原型方法的重点是hasOwnProperty和isPrototypeOf

  • Object是所有类的父类 , 所以它的原型方法及属性所有的类都可以使用

  • Object的静态方法是为所有的对象服务的 , 里面的参数都是对象

  • defineProperty和观察者模式都是vue2的底层实现 ( 实现vue2的双向数据绑定 )

  • for...in只能遍历对象的可枚举属性 ( 它也可以继承父类的属性 )

面试题

for...in和Object.keys 和Object.getOwnPropertyNames的区别 ( 获取属性的三种方式 )

  • for...in包含继承的属性和自身的属性 ( 不包含不可枚举的属性 )

  • Object.keys 只包含自身的属性 ( 不包含不可枚举的属性和继承的属性 )

  • Object.getOwnPropertyNames 只包含自身的属性和不可枚举的 ( 不包含继承的属性 )

  • 三个方法都不包含symbol的属性

 

标签：console,log,day25,Object,讲解,obj,属性,name
From： https://www.cnblogs.com/itlulu/p/16867625.html

相关文章

  • R3下用ZwQueryObject/ZwDuplicateObject关闭互斥体和解除文件占用
      不少程序在运行时会创建/打开全局Mutex，来限制用户多开。百度上搜一圈下来，他们的实现基本是这样:intmain(intargc,char*argv[]){HANDLEhMtx=CreateMutex(NULL......
  • day27SPA路由及SASS讲解
    路由前端路由：根据对应路由地址渲染不同的内容前端路由的分类：1.页面路由（刷新）：根据地址访问不同的页面（location.href location.assign location.replace）hash路由（不会刷......
  • JAVA回调函数简单讲解 CallBack
    回调，其实就是有个回应的那种感觉。那么，接下来，我们就用消息推送的场景，简简单单地讲解下回调函数的使用。直接看代码，先创建一个回调接口，MessageCallBack/***@Author:JCccc......
  • Wdf框架之WdfObject状态机(2) 一文再补充
      万万没想到<Wdf框架之WdfObject状态机(2)>的内容如此之多，2篇博客的篇幅还不够承载，需要第三篇来完成最后一击。本文将进入FxObject::DeleteWorkerAndUnlock的else分支......
  • Springboot Condition 实用讲解，只看一遍包学会
    前言该篇文章，还是一贯的风格，源码+示例+自言自语的分析，目的只有一个：就是想让大家都会玩 Condition、Conditional。正文先看看Condition是被放在包springcontext（上下文/......
  • 『论文笔记』Faster R-CNN: Towards Real-Time Object Detection with Region Proposa
    FasterR-CNN:TowardsReal-TimeObjectDetectionwithRegionProposalNetworks!文章目录​​一.FasterR-CNN的思想​​​​1.1.R-CNN，FastR-CNN，FasterR-CNN对比​......
  • CH573F蓝牙从机(peripheral)例程讲解(服务修改篇)
    修改服务需要对蓝牙比较熟悉的工程师去完成，否则在例程功能满足自己需求时，不建议修改，很容易改错，下面就简单介绍下如何在别的char添加一个nofify属性。step1：给SimpleProfi......
  • ObjectMapper详细介绍
    参考声明:https://blog.csdn.net/qq_42017395/article/details/107555339简介ObjectMapper类(com.fasterxml.jackson.databind.ObjectMapper)是Jackson的主要类，它可以......
  • 理解Object.defineProperty的作用
    对象是由多个名/值对组成的无序的集合。对象中每个属性对应任意类型的值。定义对象可以使用构造函数或字面量的形式： varobj=newObject;//obj={}obj.name="张......
  • CorelDRAW2023最新版下载及功能讲解
    CorelDRAW2023最新版，支持WIN10系统（64位）转载于:​​https://www.sohu.com/a/602955432_120864439​​coreldraw是一款深受设计师们喜爱的制图软件，它能够帮助设计师绘制出许......

赞助商

阅读排行

网站主页关于我们联系我们网站地图

本网站内容转载自其他媒体，侵权联系[admin##ips99.com]。

Copyright © 2020-2023 IPS99 版权所有 IPS99