js创建对象数组_JS 对象

本文介绍了JavaScript中对象的创建方式,包括new操作符、字面量和构造函数模式。接着讨论了如何删除、查看和修改对象的属性,强调了delete操作符的使用。此外,还详细阐述了in运算符和hasOwnProperty方法在判断对象属性时的区别,提醒开发者注意不要轻易修改原型。
摘要由CSDN通过智能技术生成

对象

定义

  1. 无序的数据集合
  2. 键值对集合

创建对象的方式

  1. new 操作符 + Object 创建对象
var person = new Object();
    person.name = "lisi";
    person.age = 21;
    person.family = ["lida","lier","wangwu"];
    person.say = function(){
        alert(this.name);
}

2. 字面式创建对象

var person ={
    name: "lisi",
    age: 21,
    family: ["lida","lier","wangwu"],
    say: function(){
        alert(this.name);
    }
};

3. 构造函数模式

function Person(name,age,family) {
    this.name = name;
    this.age = age;
    this.family = family;
    this.say = function(){
        alert(this.name);
    }
}
var person1 = new Person("lisi",21,["lida","lier","wangwu"]);
var person2 = new Person("lisi",21,["lida","lier","lisi"]);
  • 属性名:每个key都是对象的属性名(property)
  • 属性值:每个value都是对象的属性值
  1. 键名是字符串,不是标识符,可以包含任意字符。
  2. 引号可以省略,省略之后就只能写标识符。
  3. 就算引号省略了,键名也还是字符串

对象的隐藏属性

隐藏属性

  • JS中每一个对象都有一个隐藏属性
  • 这个隐藏属性储存着其共有属性组成的对象的地址
  • 这个共有属性组成的对象叫做原型
  • 也就是说,隐藏属性储存着原型的地址

删除对象的属性

delete 操作符用于删除对象的某个属性

语法

delete object.property
delete object[‘property’]
  1. 通过delete操作符, 可以实现对对象属性的删除操作,如果返回为true,则删除成功。
  2. 如果删除的属性不存在,delete将不会起任何作用,但仍会返回true
  3. delete操作只会在自身的属性上起作用

4cdd30b7494eff08b07d3063224a53a1.png

查看对象的属性

语法

obj.key
obj.['key']  //[]里面的是字符串,而不是变量
  1. Object.keys(): 返回一个包括对象内可枚举属性以及方法名称的数组。
  2. Object.getOwnPropertyNames():方法返回一个指定对象所有自身属性的属性名组成的数组。

a27f125ab697155f74023b66531eb719.png

3.Object.hasOwnProperty() 判断自身属性与共有属性

1784bb1d1dd59d75316254bee3fbc924.png

4.Object.hasOwnProperty() 判断自身属性是否存在

cf9eacea751b43a54c707b3a3e93f6d6.png

添加、修改对象的属性

1. 修改或增加属性

直接赋值:如果key存在,直接修改key的值,如果key不存在,那么这个对象就会添加一个key并赋值。

示例

let person={name:'lanycsq'}
console.log(person.name )//"lanycsq"
person.name='xiao'       
console.log(person.name ) // "xiao"
person.age=18
console.log(person.name ) //{name: "xiao", age: 18}

批量赋值:

示例

var person={name:'lanycsq'}
console.log(person)  //{name: "lanycsq"} 
Object.assign(person,{age:18,email:'lancsq.163.com'})
console.log(person)  //{name: "lanycsq", age: 18, email: "lancsq.163.com"}

2. 修改或增加共有属性

无法通过自身修改或增加共有属性

let obj={}, obj2={}  //共有属性toString 
obj.toString='xxx'  //只是在改obj自身属性 
obj2.toString      //还是在原型上

如果偏要修改或增加原型上的属性:

obj.__proto__.toString='xxx'  //不推荐使用__proto__ 
Object.prototype.toString='xxx' 

一般来说,不要修改原型,会引起很多问题

3. 修改隐藏属性

推荐使用Object.create

let common={kind: 'human'}
let obj=Object.create(common)  //以common为原型创建obj
obj.name='jack'

in和hasOwnProperty的区别

  • in判断的是对象的所有属性,包括对象实例及其原型的属性;
  • hasOwnProperty是判断对象实例的是否具有某个属性,不包含原型对象的属性。
function Person(){
}
Person.prototype.name = "lanycsq";
​
var person = new Person();
console.log(person.hasOwnProperty("name")); //false
console.log("name" in person); //true
console.log(person.name); //"lanycsq"
​
person.name = "xiaoxiao";
console.log(person.hasOwnProperty("name")); //true
console.log("name" in person); //true
console.log(person.name); //"xiaoxiao"
​
delete person.name;
console.log(person.hasOwnProperty("name")); //false
console.log("name" in person); //true ,这个时候访问的原型对象上的name
console.log(person.name); //"lanycsq"

以上代码执行的时候,name属性可以从实例中获取的或者原型对象中获取,因此使用in 来访问 name属性始终返回true;而hasOwnProperty()只能获取实例对象中的属性,所以当delete person.name后,实例对象中的name被删除,所以后面用hasOwnProperty返回false。当删除了实例中的name属性后,恢复了原型中name属性的连接,所以返回lanycsq。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值