一次面试，发现自己JavaScript对象知识这一块掌握的不好，一些知识点欠缺，所以特定总结一下关于JavaScript对象的相关知识。
在JavaScript中几乎“所有的事物”都是对象， 除了原始值， 都是对象。
一、对象的定义：
JavaScript的原始值
原始值指的是没有属性或方法的值，原始数据类型指的是拥有原始值的数据。
定义了5种原始数据类型： 1. string 2. number 3. boolean 4. null 5. undefined
对象是包含变量的变量
JavaScript 变量能够包含单个的值，实例：
var test = "Bob Test";对象也是变量， 且能够包含很多的值， 值按照名称：值对的形式编写，例：
var test = {firstName: "Bob", lastName: "Tom", age: 20}JavaScript 对象是命名值的集合，JavaScript对象中的命名值被称为属性。
以名称值对书写的对象类似于： C中的哈希表 和 Java中的哈希映射等；
对象方法
方法是可以在对象上执行的动作， 对象属性可以是原始值、其他对象以及函数；
对象方法是包含函数定义的对象属性, JavaScript对象是被称为属性和方法的命名值的容器。
| 属性 | 值 |
| firstName | Bob |
| lastName | Tom |
| age | 20 |
创建JavaScript对象 有三种方法：
1. 定义和创建单个对象，使用对象文字；
对象文字值的是花括号 ｛｝中的名称：值对
var obj = { firstName: "test1", lastName: "test2", age: 20 };
var obj = {
firstName: "test1",
lastName: "test2",
age : 20
};
2. 定义和创建单个对象，通过关键词new；
var obj = new Object();
obj.firstName = "test1";
obj.lastName = "test2";
obj.age = 20;3. 定义对象构建器，然后创建构造类型的对象。
在 ES5中，还可以通过函数 Object.create() 来创建对象。
JavaScript对象是容易改变的， 它们通过引用来寻址， 而非值， 比如：
var a = Test; //不会创建Test的副本, 对a的任何改变都将改变Test，他们是相同的对象。
var obj = {firstName: "test1", age: 20 }
console.log(obj.age); //20
var a = obj;
a.age = 21;
a.firstName = "test2";
console.log(obj); // {firstName: "test2", age: 21}
二、对象的属性：
属性指的是与JavaScript对象相关的值，JavaScript对象是无序属性的集合， 属性通常可以被修改、添加和删除，但是某些属性是只读的。
访问对象属性的语法是：
第一种 objectName.property // obj.age第二种： objectName["property"] //obj["age"]第三种： objectName[expression] //x = "age"; obj[x] ,表达式必须计算为属性名（1）JavaScript for...in 语句遍历对象的属性。
for...in 循环中的代码块会为每个属性执行一次， 循环对象的属性：
var obj = {firstName: "Bob", lastName: "Tom", age: 20}
for(i in obj){
console.log(i);
console.log(obj[i]);
}
// firstName Bob lastName Tom age 20 （2）添加新属性， 通过简单的赋值，向已存在的对象添加新属性。（不能使用预留词作为属性名）
var obj = {firstName: "Bob", lastName: "Tom", age: 20}
obj.size = "big";
console.log(obj); //{firstName: "Bob", lastName: "Tom", age: 20, size: "big"}（3）删除属性， delete 关键词从对象中删除属性:
var obj = {firstName: "Bob", lastName: "Tom", age: 20, size: "big"}
delete obj.lastName;
console.log(obj); //{firstName: "Bob", age: 20, size: "big"}delete 关键词会同时删除属性的值 和 属性本身， 删除之后，属性在被添加回来之前是无法使用的。
delete 操作符 被设计用于对象属性， 它对变量或 函数没有影响。
delet 操作符 不应被用于预定义的 JavaScript 对象属性，这样做会使得应用程序崩溃。
三、对象的方法：
JavaScript 方法是能够在对象上执行的操作， JavaScript 方法是包含函数定义的属性。
this 关键词 ， 在JavaScript中，被称为 this 的事物， 指的是拥有该JavaScript 代码的对象；
this 的值， 在函数中使用时， 是“拥有”该函数的对象。
实例：
var obj = {
firstName: "Bob",
lastName: "Tom",
age: 20,
testName: function () { //创建对象方法
return this.firstName + " 对象方法的测试 " + this.lastName;
}
}
console.log(obj.testName()); //obj.testName() 访问对象方法四、JavaScript对象访问器（Getter 和 Setter）
ES5 （2009年）引入了Getter 和 Setter ，它们允许你定义对象访问器。
var obj = {
firstName: "Bob",
lastName: "Tom",
age: 20,
set first(first){ //使用first属性来设置firstName属性的值
this.firstName = first;
},
get last(){ //使用last属性来获取lastName属性的值
return this.lastName;
}
}
//使用setter来设置对象属性
obj.first = "BobSetter方法测试";
console.log(obj.firstName); //BobSetter方法测试
console.log(obj.last); //Tom使用 getter 和 setter 时，JavaScript 可以确保更好的数据质量；优点：
1. 提供了更简洁的语法 2. 允许属性和方法的语法相同
3. 可以确保更好的数据质量 4. 有利于后台工作
Object.defineProperty() 方法也可以用于添加 Getter 和 Setter。
五、对象构造器
创建相同类型的许多对象的 “蓝图”， 创建一种“对象类型”的方法，是使用对象构造器函数。
以下这个函数Obj() 就是对象构造器函数， 通过 new关键词调用构造器函数可以创建相同类型的的对象。
function Obj(first, last, age) {
this.firstName = first;
this.lastName = last;
this.age = age;
}
var test = new Obj("Marin", "Tom", 19);
var test2 = new Obj("Stike", "Mary", 20);六、 对象原型
所有的JavaScript对象都从原型继承属性和方法。
你无法为已有的对象构造器添加新属性：
function Obj(first, last, age) {
this.firstName = first;
this.lastName = last;
this.age = age;
}
var test = new Obj("Marin", "Tom", 19);
var test2 = new Obj("Stike", "Mary", 20);
Obj.play = "swim";
console.log(test.firstName + " 测试添加 " + test.play);
//输出==》 Marin 测试添加 undefined 如果要向构造器中添加一个新的属性，则必须把它添加到构造器函数中。
function Obj(first, last, age) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.play = "swim";
}
var test = new Obj("Marin", "Tom", 19);
var test2 = new Obj("Stike", "Mary", 20);
Obj.play = "swim";
console.log(test.firstName + " 测试添加 " + test.play);
//输出==》 Marin 测试添加 swim 原型继承： 所有JavaScript 对象都从原型继承属性和方法；
日期对象都继承自Date.prototype，数组对象继承自Array.prototype
Object.prototype 位于原型继承链的顶端。
使用prototype 属性， 可以为对象构造器添加新的属性。
function Obj(first, last, age) {
this.firstName = first;
this.lastName = last;
this.age = age;
}
var test = new Obj("Marin", "Tom", 19);
Obj.prototype.play = "sleep";
console.log(test.play); //sleep
七、操作对象的一些小技巧：
（1）动态的去更改对象的key
const testKey = 'test';
let obj = {
firstName: "Mr",
lastName: "Bob",
age: 20,
[testKey]: '测试'
}
console.log(obj); //{firstName: "Mr", lastName: "Bob", age: 20, test: "测试"}（2）判断对象的数据类型
//用Object.prototype.toString 配合闭包来实现对象数据类型的判断
function Test(type){
return function(num){
return `[object ${type}]` === Object.prototype.toString.call(num)
}
}
console.log(Test('Number')(100));（3）使用 ... 运算符合并对象或数组中的对象
const obj1 = {
firstName: 'Tom心累',
age: 22
}
const obj2 = {
firstName: 'Mary',
address: '广东'
}
const mergeObj = {...obj1, ...obj2};
console.log(mergeObj); //{firstName: "Mary", age: 22, address: "广东"}（4）检查某对象中是否含有某个属性
var obj3 = {
name: 'Jerry',
age: 20
}
console.log(obj3.hasOwnProperty('name')); // true
console.log('name' in obj3); //true
console.log(obj.hasOwnProperty('valueOf')); //false, 因为valueOf继承自原型链
console.log('valueOf' in obj); //true
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
