前端开发_JavaScript_常用对象之Object对象

常用对象之Object对象

1.引入

上两次课程，我们学习了对象的基本操作和使用，下面我们就一起来学习一下一些常用的对象。这一些对象是JavaScript提供的非常有用的内部对象，为编程人员提供了强大的脚本程序，给开发人员提供了很大的便利。

我们在学习之前先讨论一下如何快速的学习这一些常用的对象呢？我们可以这样学习:

(1).知道这一个对象是用来干嘛的。也就是这一个对象的功能。

(2).知道如何创建这一个对象，创建对象就是为了使用这一个对象，一般情况创建就是通过new 对应的构造函数。这样就可以创建这一个对象了。

(3).这一个对象提供了哪一些属性和方法，这一些就是这一个对象的最主要发功能，可以帮助我们解决实际开发中的问题。

2.Object对象

(1).Object对象概述:object对象是一常用的对象，我们可以这样理解这一个对象，它是一个基类对象，其他类都是在它的基础上衍生出来的，所以学习这一个对象有助于我们快速的学习其他的对象。

(2).Object对象的创建

一般情况，创建对象可以有两种方式来实现，一个是使用对象字面量，说白了就是我们之前学习对象的最开始的方式，使用键值对的形式定义对象。另一种就是通过构造函数，然后通过对这一个对象进行赋值，这样也可以把数据存储到对象里面。

    ①:使用对象字面量定义Object对象

<div class="box" id="box">
</div>

<script type="text/javascript">
   //使用对象字面量来实现Object对象的定义
   var stu = {
	 stuName:'张三',
	 stuAge:'20',
	 stuSex:'女'
   } 
   document.getElementById("box").innerHTML = JSON.stringify(stu);
</script>

   ②:使用构造函数创建对象，然后再设置对象的属性并赋值

<div class="box" id="box">
</div>
		
<script type="text/javascript">
   //使用构造函数创建对象
   var stu = new Object();
   stu.stuName = '李四';
   stu.stuAge = 21;
   stu.major = '计算机应用技术';
			
   document.getElementById("box").innerHTML = JSON.stringify(stu);
</script>

  由于这一个Object对象是其他对象的基类，所有我们可以使用Object对象构造出其他的七大基本数据类型的对象，如:

var flag = new Object(true);
var test = new Object(null);

 (3).Object对象的常用属性和方法

      ①:constructor属性

          一个引用值，指向Object 构造函数。实际就是存储Object的方法。

var test = new Object();
console.log(test.constructor);

      

      ②:常用静态方法_Object.assign()

       Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象。

var target = { a: 1, b: 2 };
var source = { b: 3, c: 4 };
var returnedTarget = Object.assign(target, source);
console.log(target);  // expected output: Object { a: 1, b: 3, c: 4 }
console.log(returnedTarget);  // expected output: Object { a: 1, b: 3, c: 4 }

   ③:常用静态方法_Object.is()

 Object.is() 方法判断两个值是否为同一个值。

Object.is('foo', 'foo');     // true
Object.is(window, window);   // true

Object.is('foo', 'bar');     // false
Object.is([], []);           // false

var foo = { a: 1 };
var bar = { a: 1 };
Object.is(foo, foo);         // true
Object.is(foo, bar);         // false

Object.is(null, null);       // true

// 特例
Object.is(0, -0);            // false
Object.is(0, +0);            // true
Object.is(-0, -0);           // true
Object.is(NaN, 0/0);         // true

  ④:常用实例方法_hasOwnProperty()

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

<script type="text/javascript">
   var stu = {
	 stuName:'张三',
	 stuAge:'20',
	 stuSex:'女'
   } 
   //测试hasOwnProperty()是否保护特殊的属性
   console.log("---" + stu.hasOwnProperty("stuName"));
   console.log("---" + stu.hasOwnProperty("stuMajor"))
</script>

 ⑤:常用实例方法_toString()

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

<script type="text/javascript">
   function stu(stuName,stuAge,stuSex) {
	 this.stuName = stuName;
	 this.stuAge = stuAge;
	 this.stuSex = stuSex;
   }
		 
   var st = new stu("张三",20,"男");
		 
   //为了正确的输出，这里需要重新定义一个函数，类似于java中重写toString()方法。
	stu.prototype.toString = function stuToString() {
	  return `${this.stuName} + "," + ${this.stuAge} + "," +${this.stuSex}`;
	};

    //输出信息
	console.log("---" + st.toString());
</script>

 ⑥:常用实例方法_valueOf() 

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

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

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

// new一个Boolean对象
var newBool = new Boolean(true);
// valueOf()返回的是true，两者的值相等
console.log(newBool.valueOf() == newBool);   // true

// Object：返回对象本身
var obj = {name: "张三", age: 18};
console.log( obj.valueOf() === obj );   // true

// String：返回字符串值
var str = "http://www.xyz.com";
console.log( str.valueOf() === str );   // true