资讯专栏INFORMATION COLUMN

javascript面向对象之创建对象

bingchen / 3222人阅读

摘要:表示能否修改属性的值。对于直接在对象上定义的属性,这个特性的默认值为。默认值为设置一个属性的值会导致其他属性的变化如果的有值,就不要对再设置属性所在的对象要读取其描述符的属性名称

对象定义

对象定义:无序属性的集合,其属性可以包含基本值、对象或函数
对象就是 键值对 其中值可以是数据和函数
对象方法就是对象的属性 不过这个属性是函数

var p = new Object()

p.name = "nike"
p.age = "10"
p.job = "joker"

p.sayName = function() {
  console.log(this.name)
}
console.log(p.age)//10
p.sayName()       //nike
var p = {
  name: "nike",
  age: "10",
  job: "joker",
  sayName: function(){
    console.log(this.name)
  }
}

console.log(p.job)//joker
p.sayName()       //nike
属性类型 数据属性

Configurable:表示能否通过 delete 删除属性从而重新定义属性,能否修改属性的特
性,或者能否把属性修改为访问器属性。像前面例子中那样直接在对象上定义的属性,它们的这个特性默认值为 true。
Enumerable:表示能否通过 for-in 循环返回属性。像前面例子中那样直接在对象上定
义的属性,它们的这个特性默认值为 true。
Writable:表示能否修改属性的值。像前面例子中那样直接在对象上定义的属性,它们的
这个特性默认值为 true。
Value:包含这个属性的数据值。读取属性值的时候,从这个位置读;写入属性值的时候,把新值保存在这个位置。这个特性的默认值为 undefined。
修改这 3 个值需要用 es5 的Object.defineProperty()方法

这个方法接收 3 个参数:属性所在的对象、属性的名字、描述符对象

描述符对象的属性必须是:configurable enumerable writeble value

var person = {}
Object.defineProperty(person, "name", {
  writable: true,
  value: "nike" 
})
console.log(person.name)//nike
person.name = "gray"
console.log(person.name)//gray
var person = {}
Object.defineProperty(person, "name", {
  configurable: true,
  value: "nike"
})
console.log(person.name)//nike
delete person.name
console.log(person.name)//undefined
访问器属性

Configurable:表示能否通过 delete 删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为数据属性。对于直接在对象上定义的属性,这个特性的默认值为true
Enumerable:表示能否通过 for-in 循环返回属性。对于直接在对象上定义的属性,这个特性的默认值为 true。
Get:在读取属性时调用的函数。默认值为 undefined。
Set:在写入属性时调用的函数。默认值为 undefined

var person = {
  oldname: "jac",
  age: "10"
}

Object.defineProperty(person, "newname", {
  get: function(){
    return this.oldname
  },
  set: function(value){
    this.oldname = value
  }
})

person.newname = "bool"
console.log(person.oldname)//bool

//设置一个属性的值会导致其他属性的变化
var person = {
  name: "handsome"
}

Object.defineProperties(person, {
  boy: {
    get: function () {
      return this.name + " hua"
    },
    set: function (value) {
      return this.name = value
    }
  },
  man: {
    get: function () {
      return this.name
    },
    set: function (value) {
      return this.name = value
    }
  },
  year: {
    value: 20
  }
})

console.log(person.boy)//handsome hua
console.log(person.man)//handsome
//如果person的name有值,就不要对name再设置 get set
var descriptor = Object.getOwnPropertyDescriptor(person, "year")
//属性所在的对象、要读取其描述符的属性名称
console.log(descriptor.value)//20

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/84642.html

相关文章

  • javascript 面向对象版块理解对象

    摘要:用代码可以这样描述安全到达国外面向过程既然说了面向对象,那么与之对应的就是面向过程。小结在这篇文章中,介绍了什么是面向对象和面向过程,以及中对象的含义。 这是 javascript 面向对象版块的第一篇文章,主要讲解对面向对象思想的一个理解。先说说什么是对象,其实这个还真的不好说。我们可以把自己当成一个对象,或者过年的时候相亲,找对象,那么你未来的老婆也是一个对象。我们就要一些属性,比...

    lovXin 评论0 收藏0
  • SegmentFault 技术周刊 Vol.32 - 七夕将至,你的“对象”还好吗?

    摘要:很多情况下,通常一个人类,即创建了一个具体的对象。对象就是数据,对象本身不包含方法。类是相似对象的描述,称为类的定义,是该类对象的蓝图或原型。在中,对象通过对类的实体化形成的对象。一类的对象抽取出来。注意中,对象一定是通过类的实例化来的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 马上就要到七夕了,离年底老妈老爸...

    李昌杰 评论0 收藏0
  • SegmentFault 技术周刊 Vol.32 - 七夕将至,你的“对象”还好吗?

    摘要:很多情况下,通常一个人类,即创建了一个具体的对象。对象就是数据,对象本身不包含方法。类是相似对象的描述,称为类的定义,是该类对象的蓝图或原型。在中,对象通过对类的实体化形成的对象。一类的对象抽取出来。注意中,对象一定是通过类的实例化来的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 马上就要到七夕了,离年底老妈老爸...

    Lyux 评论0 收藏0
  • SegmentFault 技术周刊 Vol.32 - 七夕将至,你的“对象”还好吗?

    摘要:很多情况下,通常一个人类,即创建了一个具体的对象。对象就是数据,对象本身不包含方法。类是相似对象的描述,称为类的定义,是该类对象的蓝图或原型。在中,对象通过对类的实体化形成的对象。一类的对象抽取出来。注意中,对象一定是通过类的实例化来的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 马上就要到七夕了,离年底老妈老爸...

    AaronYuan 评论0 收藏0
  • javascript 面向对象版块定义多个对象属性以及读取属性特性

    摘要:返回值是一个对象,如果是访问器属性,这个对象的属性有和如果是数据属性,这个对象的属性有和。上一篇面向对象版块之对象属性下一篇面向对象版块之创建对象 这是 javascript 面向对象版块的第三篇文章,主要讲解的是多个属性的定义以及读取属性的特性。前面这几章内容目的在于加深对对象的理解,这样可以利于理解后面的原型链以及继承方面的知识,或者你也可以了解一下不一样的 javascript ...

    wendux 评论0 收藏0
  • javascript 面向对象版块对象属性

    摘要:上一篇面向对象版块之理解对象下一篇面向对象版块之定义多个对象属性以及读取属性特性 这是 javascript 面向对象版块的第二篇文章,主要讲解的是对象的属性,首先创建一个对象: var person = { name: Nicholas, age: 29, job: Software Engineer, sayName: function () { conso...

    lolomaco 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<