四时宝库

程序员的知识宝库

JavaScript,ES6,数据类型,Object,属性和方法的应用代码

数据类型Object

Object是JavaScript的一种 数据类型 。它用于存储各种键值集合和更复杂的实体,Objects 可以通过Object()构造函数或者使用对象字面量的方式创建。

Object的属性:

Object.prototype.constructor,创建实例对象的Object构造函数的引用。

Object的方法:

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

Object.defineProperties(),方法直接在一个对象上定义新的属性或修改现有属性,并返回该对象。

Object.defineProperty(),方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象。

Object.keys(),方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和正常循环遍历该对象时返回的顺序一致 。

Object.entries(),方法返回一个给定对象自身可枚举属性的键值对数组,其排列与使用for...in循环遍历该对象时返回的顺序一致(区别在于 for-in 循环还会枚举原型链中的属性)。

Object.freeze(),方法可以冻结一个对象。

官方地址:

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object

代码案例

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Object类的属性和方法</title>
	</head>
	<body>
		<script type="text/javascript">
			// ====================================================================//
			// Object.prototype.constructor
			// ====================================================================//
			var obj1 = {};
			console.log(obj1.constructor === Object);  // true
			var obj2 = new Object;
			console.log(obj2.constructor === Object);  // true
			var arr1 = [];
			console.log(arr1.constructor === Array); //  true
			var arr2 = new Array;
			console.log(arr1.constructor === Array); //  true
			var num1 = new Number(3);
			console.log(num1.constructor === Number); //  true
			// ====================================================================//
			// Object.assign()
			// ====================================================================//
			const target = { a: 1, b: 2 };
			const source = { b: 4, c: 5 };
			const returnedTarget = Object.assign(target, source);
			console.log(target); // Object { a: 1, b: 4, c: 5 }
			console.log(returnedTarget); // Object { a: 1, b: 4, c: 5 }
			// ====================================================================//
			// Object.defineProperty
			// ====================================================================//
			// 第一个参数为对象,对象为函数调用之后返回新对象的原型对象
			// 第二个参数为对象本身的实例方法(默认不能修改,不能枚举)
			const obj = Object.create({a:1}, {b: {value: 2}})
			console.log(obj.__proto__.a === 1); // true 
			obj.b = 3;
			console.log(obj.b);  // 2
			//创建一个可写的,可枚举的,可配置的属性p
			obj2 = Object.create({}, {
				person: {
					value: 2,           //  属性值
					writable: true,     //  是否可以重写值
					enumerable: true,   //  是否可枚举
					configurable: true  //  是否可以修改以上几项配置
				},
				user:{
					value:11,
					writable: true,     //  是否可以重写值
					enumerable: true,   //  是否可枚举
					configurable: true  //  是否可以修改以上几项配置
				}
			});
			console.log(obj2.user);
			console.log(Object.keys(obj2));
			obj2.person = 3;
			console.log(obj2.person);    //  3
			// ====================================================================//
			// Object.defineProperty()
			// ====================================================================//
			const object1 = {};
			Object.defineProperty(object1, 'property1', {
				value: 42,
				writable: false
			});
			object1.property1 = 77; // throws an error in strict mode
			console.log(object1.property1); // expected output: 42
			// ====================================================================//
			// Object.defineProperties()
			// ====================================================================//
			var obj3 = {};
			Object.defineProperties(obj3, {
				'property1': {
					value: true,
					writable: true
				},
				'property2': {
					value: 'Hello',
					writable: false
				}
				// etc. etc.
			});
			console.log(obj3);
			// ====================================================================//
			// Object.entries()
			// ====================================================================//
			const obj4 = {
				a: 'somestring',
				b: 42
			};
			// Object.entries
			for (const [key, value] of Object.entries(obj4)) {
			  console.log(`${key}: ${value}`);
			}
			// ====================================================================//
			// Object.freeze(),方法可以冻结一个对象。
			// ====================================================================//
			const obj5 = {
				prop: 42
			};
			Object.freeze(obj5);
			obj5.prop = 33;  // Throws an error in strict mode
			console.log(obj5.prop);  // 42
		</script>
	</body>
</html>

发表评论:

控制面板
您好,欢迎到访网站!
  查看权限
网站分类
最新留言
    友情链接