Javascript中对象的知识点大总结ᕦ(･ㅂ･)ᕤ

前言

学计算机的大多数都听过一个梗：没有对象咋办，咱们来new一个！那么这个对象到底是啥呢，在编程语言中如何去实现呢? 这篇文章我总结了在JS中对象相关的知识点，无论你是编程萌新还是老手，都能通过本文快速学习或是回顾对象的重要知识点，希望能帮助到你们~

---

一、对象的定义方式

第一种：使用new

这就是开玩笑常说的方式，new一个：

var person = new Object();
person.name = 'alice';
person.age = '10';

这里定义了一个名为person的对象，它有两个属性分别是name和age，这里也对这两个属性进行了赋值

除了上面的点以外还有[ ]的赋值方式：

person['age']= '10';

第二种：对象字面量

1. 简单字面量
   直接看下面例子：

var person2 = {};
person2.name='Alice';
person2['age'] = '15';
person2.action = function(){
    return '我是一个对象'
};
document.getElementById("test").innerHTML = person2.action();

直接定义person2为一个对象，然后下面给其属性name和age进行赋值

2. 嵌套字面量
   这里的键名加不加引号都是可行的。定义对象之后直接在括号里面以键值对的方式完成赋值

var person3 = {
    name:'Jack',
    age:16,
    action:function(){
        return this.name
    }
};
person3.action() ;   //Jack

二、对象属性的获取方法

对象属性的获取

上面我们讲了对象属性的设置方式有 . 和 [ ] 两种，这里对象属性的获取方式也是有这两种。
. 是取自身属性
[ ] 可以是变量，如下例子：

var obj = {};
obj.name = 'Javascript';
obj['age'] = 18;
obj.name;
obj['age'];

var a = 'age';
obj[a]; //18 

对象属性的枚举

我们还可以用 for in 来遍历对象的属性，如下：

var obj2 = {name:'Javascript',age:18,id:1};
for(o in obj2){
    console.log(o)  //获取键名  name  age  id
    console.log(obj2[o]);   //获取value值  
};

通过这个方法我们能获取到键名和value的值，在数组中也能使用这个方法，不过得到的是索引的值

var arr = ['a','b','c'];
for(a in arr){
    console.log(a)   //得到是索引  0123
};

三、对象的常用方法

对象序列化（对象和字符串转换）

什么是对象序列化？先来看一下定义：
序列化(Serialization)是将对象的状态信息转换为可以存储或传输的形式的过程（来自百度百科）
大家会比较好奇，在实际开发中哪里会用到这个？
比如：获取后台传来的数据是对象格式，我们需要把它存入浏览器本地，这个时候就需要转换为json字符串进行存储，废话不多说，来看怎么实现;

• 对象转json字符串 JSON.stringify()
• json字符串转对象 JSON.parse()

var obj3 = {name:'abc',age:18,id:1};
console.log(typeof  JSON.stringify(obj3))   //string
console.log(typeof  obj3); //object
var str = JSON.stringify(obj3);
console.log(typeof  JSON.parse(str));   //object

hasOwnProperty()

该方法可以判断对象的自有属性是否存在,用来检测
返回的结果是布尔 满足条件true 反之false

 var o = {
    flag:'a'
};
o.hasOwnProperty('flag')

assign()

该方法主要用于对象的合并

var o2 = {name:'abc',age:18};
var o3 = {id:1,address:'武汉'};
var o4 = Object.assign(o2,o3);
console.log(o4) //{name: "abc", age: 18, id: 1, address: "武汉"}

如果属性相同，则后面会覆盖前面的属性，不同则添加

var o5 = {num:'10',address:'重庆'};
console.log(Object.assign(o4,o5)) ;

结果为： {name: “abc”, age: 18, id: 1, address: “重庆”, num: “10”}

defineProperty()

直接在一个对象上定义新的属性或修改现有属性，并返回该对象。

var o6 = {};
Object.defineProperty(o6,'name',{
    value:'张三',
    writable:false  
    //属性是否可以修改   true可以修改  false只读 
});

定义多个属性

Object.defineProperties(o6,{
    'name':{
        value:'abc',
        writable:false
    },
    'age':{
        value:18,
        writable:false
    }
});
o6 //{name:'abc',age:18}

keys()

返回一个由一个给定对象的自身可枚举属性组成的数组

 var o7 = {name:'abc',age:18};
 var a2 = Object.keys(o7); 
 //返回的是数组  ["name", "age"]

values()

返回一个给定对象自己的所有可枚举属性值的数组

var a3 = Object.values(o7)  //["abc", 18]

entries()

返回一个给定对象自身可枚举属性的键值对数组

var a4 = Object.entries(o7) 
//[["name", "age"],["abc", 18]]

最后

如有补充欢迎评论区留言补充，纯手敲整理不易，对你有帮助点赞支持下呀~