JavaScript对象详解，深入理解js对象

定义：

对象是JavaScript的基本数据类型。对象也是一种复合值：可以通过名字访问这些值，我们可以将对象看做是从字符串到值的映射，当然对象不仅仅是字符串到值的映射，除了自有的属性还可以从原型继承属性。

创建对象:

1.字面量方式

	var empty={} //创建一个空对象

	var obj={a:1,b:2}; //两个属性的对象

	var compObj={a:'1',b:'2',cc:{
						d:'3',
						e:'4'
					}
				}; //复杂的对象

2.new构造函数的方式创建对象

  var a = new Array();//创建一个空数组
  var d = new Date();//创建当前时间的Date对象

3.原型对象方式

function Person(name){
 	this.name=name;
  }
  Person.prototype.eat=function(){
	 console.log(this.name+"是个好人");
  }
 var zhangsan =new Person("张三");

4.Object.create()

   var o1=Object.create({a:1,b:2});//o1会继承属性 a和b

属性的查询和设置

可以通过点(.)和方括号([])来获取属性的值

   var o1={
   		a:1,
   		b:2,
   		'hello zhangsan':'张三'
   }
   o1.a //1
   o1.b //2
   o1['a']//1
   o1['b']//2
   var key='hello zhangsan';
  	   o1[key]//张三
  	 o1.key//undefined
  	 o1.hello zhangsan //报错

可以看出对于点 (.) 来说，右侧必须是一个以属性名称命名的简单标示符。对于方括号来说，方括号内是一个计算结果为字符串的表达式，而这个字符串就是属性的名字，比如：

属性名'hello zhangsan'，因为中间有空格只能用‘方括号‘的方式来获取，而其他属性则既可以 点 也可以 方括号。

设置值也是一样的，只不过有个赋值操作：

 o1.a='3'
 o1['b']='4'

删除属性

 delete o1.a;
 delete o1['b']

注意：delete运算符只能删除自有属性，不能删除继承属性。

检测属性

1.in运算符

   'a' in o1;//true 
   'b' in o1;//true
   'toString' in o1//true o继承来的属性，打开控制台可以在o1对象的__proto__属性里面找到toString

2.hasOwnPreperty()方式

   o1.hasOwnProperty('a');//true
   o1.hasOwnProperty('b');//true
   o1.hasOwnProperty('toString');//false 继承来的属性为false

3.使用 !==undefined

   o1.a!==undefined//true
   o1.b!==undefined//true
   o1.toString!==undefined// 继承来的属性为true

当然如果值直接设置了undefined，则这种检测不起作用，比如 var o1={a:undefined} ,这个a属性就没办法这样检测了。

属性的枚举

 1.for/in方式

  for(key in o1){
   	console.log(key,'===',o1[key])
   }

2.Object.keys 方式

   var keys = Object.keys(o1);
   keys.forEach((key)=>{
   	 	console.log(key,'===',o1[key])
   })

原型属性

    1.对象的__proto__均指向自身构造函数的prototype。
    2.prototype中的constructor 属性指向构造函数本身。
    3.isPrototypeOf方法检测对象自身是否处于另一个对象的原型或者处于原型链上。

对象的方法

对象从原型对象继承的基本是方法，看看几个比较重要的

1.valueOf() 方法返回指定对象的原始值。

//Array：返回数组对象本身
var array = [1,3,4,6];
console.log(array.valueOf() === array);   // true

// Number：返回数字值
var num =  123213;
console.log(num.valueOf());   // 15.2654

// boolean：返回布尔值true或false
var bool = true;
console.log(bool.valueOf() === bool);   // true

2.toString() 方法返回一个表示该对象的字符串。

可以通过这个方法来检测对象的类型，如下代码

	var toString = Object.prototype.toString;

	console.log(toString.call(new Object()));//[object Object]
	console.log(toString.call(new Date())); // [object Date]
	console.log(toString.call('abc')); // [object String]
	console.log(toString.call(123)); // [object Number]
	console.log(toString.call(true)); //  [object Boolean]
	console.log(toString.call(undefined)); // [object Undefined]
	console.log(toString.call(null)); // [object Null]
	console.log(toString.call(/./));//[object RegExp]

3.toLocaleString() 方法返回一个该对象的字符串表示。

	var toString = Object.prototype.toLocaleString;

	console.log(toString.call(new Object()));//[object Object]
	console.log(toString.call(new Date())); // Wed Dec 23 2020 20:09:24 GMT+0800 (中国标准时间)
	console.log(toString.call('abc')); // abc
	console.log(toString.call(123)); // 123
	console.log(toString.call(true)); //  true
	console.log(toString.call(/./));// /./

4.hasOwnProperty() 方法会返回一个布尔值，指示对象自身属性中是否具有指定的属性。

    var o1={
   		a:1,
   		b:2,
   		'hello zhangsan':'张三'
   }
   
   console.log(o1.hasOwnProperty('a'));//true
   console.log(o1.hasOwnProperty('b'));//true
   console.log(o1.hasOwnProperty('toString'));//false 继承来的属性为false

5.propertyIsEnumerable() 方法返回一个布尔值，表示指定的属性是否可枚举。

	//propertyIsEnumerable() 方法返回一个布尔值，表示指定的属性是否可枚举。
    var o1={
   		a:1,
   		b:2,
   		'hello zhangsan':'张三'
   }
   
   console.log(o1.propertyIsEnumerable('a'));//true
   console.log(o1.propertyIsEnumerable('b'));//true
   console.log(o1.propertyIsEnumerable('toString'));//false 继承来的属性为false

6.isPrototypeOf() 方法用于测试一个对象是否存在于另一个对象的原型链上。

   function Person(){}
   function Man(){}
   Man.prototype = Object.create(Person.prototype);
   
   var m = new Man();

	console.log(Person.prototype.isPrototypeOf(m)); // true
	console.log(Object.prototype.isPrototypeOf(m)); // true

从下图我们也可以看到 m 实例对象的__proto__指向了Person.prototype对象,同时Person.prototype对象的__proto__属性指向了Object.prototype对象。

整理不易给个三连支持一下吧，谢谢！