>  기사  >  웹 프론트엔드  >  JavaScript에서 객체를 생성하기 위해 Object() 함수를 사용하는 방법에 대해 이야기해 보겠습니다.

JavaScript에서 객체를 생성하기 위해 Object() 함수를 사용하는 방법에 대해 이야기해 보겠습니다.

青灯夜游
青灯夜游앞으로
2022-08-04 16:32:312244검색

Object() 함수를 사용하여 객체를 만드는 방법은 무엇입니까? 다음 기사에서는 Object() 생성자를 사용하여 객체를 생성하는 방법(객체를 생성하는 세 가지 다른 방법 포함)을 소개합니다. 이것이 도움이 되기를 바랍니다.

JavaScript에서 객체를 생성하기 위해 Object() 함수를 사용하는 방법에 대해 이야기해 보겠습니다.

new Object()는 객체를 생성합니다


JavaScript는 기본적으로 Object 객체를 제공하며(시작 O는 대문자로 시작합니다), 다른 모든 객체는 이 객체에서 상속됩니다. 객체 자체도 생성자이며 이를 통해 직접 새 객체를 생성할 수 있습니다.

Object() 함수는 주어진 값을 새 객체로 래핑할 수 있습니다.

구문: ​​

new Object()
new Object(value)

매개변수 은 모든 유형의 선택적 매개변수입니다. value 是任意类型的可选参数。

  • 如果value值是nullundefined或不传时,则会创建并返回一个空对象;

  • 如果value值是一个基本类型,则会构造其包装类的对象,返回一个和给定的值相对应的类型的对象。;

  • 如果value值是引用类型,则仍然返回这个值。

    如果给定值是一个已经存在的对象,则会返回这个已经存在的值(相同地址)。

var obj = new Object();      //创建了一个空的对象
obj.uname = 'zhangsanfeng';
obj.name = 18;       //字面量方式创建对象不同,这里需要用 =  赋值添加属性和方法
obj.sex = 'nan';      //属性和方法后面以;结束
obj.sayHi = function() {
console.log('hi');
}
console.log(obj.uname);  
console.log(obj['age']);

JavaScript에서 객체를 생성하기 위해 Object() 함수를 사용하는 방법에 대해 이야기해 보겠습니다.

说明:通过new Object()的写法生成新对象,与字面量的写法o = {}是等价的。

var o1 = {a: 1};
var o2 = new Object(o1);
o1 === o2 // true

new Object(123) instanceof Number
// true

与其他构造函数一样,如果要在Object对象上面部署一个方法,有两种做法。

(1)部署在Object对象本身

比如,在Object对象上面定义一个print方法,显示其他对象的内容。

Object.print = function(o){ console.log(o) };
var o = new Object();
Object.print(o)
// Object

(2)部署在Object.prototype对象

所有构造函数都有一个prototype属性,指向一个原型对象。凡是定义在Object.prototype对象上面的属性和方法,将被所有实例对象共享。(关于prototype属性的详细解释,参见《面向对象编程》一章。)

Object.prototype.print = function(){ console.log(this)};
var o = new Object();
o.print() // Object

上面代码在Object.prototype定义了一个print方法,然后生成一个Object的实例o。o直接继承了Object.prototype的属性和方法,可以在自身调用它们,也就是说,o对象的print方法实质上是调用Object.prototype.print方法。。

可以看到,尽管上面两种写法的print方法功能相同,但是用法是不一样的,因此必须区分“构造函数的方法”和“实例对象的方法”。

Object()

Object本身就是一个函数,本身当作工具方法使用时,可以将任意值转为对象。这个方法常用于保证某个值一定是对象。

  • 如果参数是原始类型的值,Object方法返回对应的包装对象的实例

Object() // 返回一个空对象
Object() instanceof Object // true

Object(undefined) // 返回一个空对象
Object(undefined) instanceof Object // true

Object(null) // 返回一个空对象
Object(null) instanceof Object // true

Object(1) // 等同于 new Number(1)
Object(1) instanceof Object // true
Object(1) instanceof Number // true

Object('foo') // 等同于 new String('foo')
Object('foo') instanceof Object // true
Object('foo') instanceof String // true

Object(true) // 等同于 new Boolean(true)
Object(true) instanceof Object // true
Object(true) instanceof Boolean // true

上面代码表示Object函数可以将各种值转为对应的构造函数生成的对象。

  • 如果Object方法的参数是一个对象,它总是返回原对象。

var arr = [];
Object(arr) // 返回原数组
Object(arr) === arr // true

var obj = {};
Object(obj) // 返回原对象
Object(obj) === obj // true

var fn = function () {};
Object(fn) // 返回原函数
Object(fn) === fn // true

利用这一点,可以写一个判断变量是否为对象的函数。

function isObject(value) {
  return value === Object(value);
}

isObject([]) // true
isObject(true) // false

扩展知识:其他创建对象的三种方法

1. 对象字面量{…}

对象字面量的方式是最常用的方式之一,它用内含属性的花括号{...}快速创建对象。

var obj1 = {};
obj1.name = "Tom";

var obj2 = { name: "Tom", age: 12 };

var name = "Tom", age = 12;
var obj3 = { name: name, age: age };
// ES2015中,属性名和变量名相同时可简写为:
var obj3 = { name, age };

// 扩展属性,ES2018新特性,可用于克隆或合并对象,浅拷贝,不包括原型
var obj4 = { ...obj3 };

2. Object.create()

Object.create()方法创建一个新对象,使用现有的对象来提供新创建的对象的__proto__

/**
 * 创建一个具有指定原型的对象,并且包含指定的属性。
 * @param o 新创建对象的原型对象。可能为空
 * @param properties 包含一个或多个属性描述符的 JavaScript 对象。
 */
create(o: object | null, properties?: PropertyDescriptorMap): any;

interface PropertyDescriptorMap {
    [s: string]: PropertyDescriptor;
}

interface PropertyDescriptor {
    configurable?: boolean;
    enumerable?: boolean;
    value?: any;
    writable?: boolean;
    get?(): any;
    set?(v: any): void;
}
var obj1 = Object.create(null);
Object.getPrototypeOf(obj1) === null;	// true

var proto= {};
var obj2 = Object.create(proto);
Object.getPrototypeOf(obj2) === proto;	// true

var obj3 = Object.create({}, { p: { value: 42 } });
// 属性描述对象中省略了的属性默认为false,所以p是不可写,不可枚举,不可配置的
Object.getOwnPropertyDescriptors(obj3);	// p: {value: 42, writable: false, enumerable: false, configurable: false}

//创建一个可写的,可枚举的,可配置的属性p
var obj4 = Object.create({}, {
	p: { value: 42, writable: true, enumerable: true, configurable: true }
});

//不能同时指定访问器(get和set)和 值或可写属性
var obj4 = Object.create({}, {
	p: {
    	// value: 42,		// 不能和get set同时存在
    	// writable: true,	// 不能和get set同时存在
    	enumerable: true,
    	configurable: true,
    	get: function() { return 10 },
    	set: function(value) { console.log("Setting `p` to", value); }
  }
});

3. Object.assign()

Object.assign()方法并不是直接用来创建对象的,但它可以达到创建对象的效果,所以这里把它也作为一种创建对象的方式。

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

Object.assign(target, …sources)
  • 如果目标对象或源对象中具有相同的属性,后面的对象的属性将覆盖前面的对象的属性。
  • 只会拷贝源对象自身的可枚举属性到目标对象。对源对象原型上的对象不做处理。
  • 该方法使用源对象的Get和目标对象的Set
    • 값이 null 또는 정의되지 않음인 경우 또는 not 전달되면 빈 객체가 생성되어 반환됩니다.

  • value 값이 기본 유형인 경우 래핑 클래스의 객체가 생성되고 다음과 유사한 객체가 생성됩니다. 해당 유형의 객체가 반환됩니다. ;
  • value 값이 참조 유형인 경우에도 이 값이 반환됩니다. 🎜주어진 값이 기존 개체인 경우 기존 값(동일 주소)이 반환됩니다. 🎜🎜🎜
    var o1 = { name: "Tom" };
    var o2 = { name: "Jerry" };
    var o3 = Object.create(o2, { 	// o2是o3的原型,name: "Jerry"是原型上的属性
    	a: { value: 42 }, 			// 不可枚举
    	b: { value: 42, writable: false, enumerable: true, configurable: false }, 
      	c: { enumerable: true, get: function() { return 10; } } 
    });
    var obj1 = Object.assign(o1, o2);
    obj1 === o1;		// true
    obj1;				// {name: "Tom", b: 42, c: 10}
    Object.getOwnPropertyDescriptors(obj1);	// 不会拷贝属性的
    /* 	b: {value: 42, writable: true, enumerable: true, configurable: true}
    	c: {value: 10, writable: true, enumerable: true, configurable: true}
    	name: {value: "Tom", writable: true, enumerable: true, configurable: true} */
    
    var o4 = { a: "a", b: { name: "Tom", age: 18 } };
    var obj2 = Object.assign({}, o4);
    obj2.b === o4.b;	// true, 浅拷贝,如果源值是一个对象的引用,它仅仅会复制其引用值。
    
    // 合并对象,后面属性覆盖前面属性
    var o1 = { a: 1, b: 1 };
    var o2 = { b: 2, c: 2 };
    var o3 = { a: 3 };
    var obj3 = Object.assign({}, o1, o2, o3);
    obj3; 			// {a: 3, b: 2, c: 2}
    
    // 基本类型会被转为包装对象,只有字符串的包装对象有自身可枚举属性。
    var obj4 = Object.assign({}, "abc", null, true, undefined, 10, Symbol("foo"));
    obj4;		// {0: "a", 1: "b", 2: "c"}
    
    // 拷贝过程中发生异常,会终止后续拷贝任务,已拷贝的数据保留
    var t = Object.create( {}, { b: { value: 42, writable: false } }); 	// b是只读属性
    Object.assign(t, {a: 1}, {a: 2, b: 2, c: 3}, {c: 4});	// Cannot assign to read only property 'b' of object '#<object>'
    t;		// {a: 2, b: 42}</object>
    🎜JavaScript에서 객체를 생성하기 위해 Object() 함수를 사용하는 방법에 대해 이야기해 보겠습니다. 🎜🎜🎜설명: 🎜new Object()를 작성하여 새 개체를 생성합니다. 이는 리터럴 o = {}를 작성하는 것과 같습니다. 🎜🎜rrreee🎜🎜다른 생성자와 마찬가지로 Object 개체에 메서드를 배포하려는 경우 두 가지 방법이 있습니다. 🎜🎜🎜 (1) Object 개체 자체에 배포🎜🎜예를 들어 다른 개체의 내용을 표시하려면 Object 개체에 인쇄 메서드를 정의합니다. 🎜rrreee🎜(2) Object.prototype 객체에 배포🎜🎜모든 생성자에는 프로토타입 객체를 가리키는 프로토타입 속성이 있습니다. Object.prototype 개체에 정의된 모든 속성과 메서드는 모든 인스턴스 개체에서 공유됩니다. (prototype 속성에 대한 자세한 설명은 "객체 지향 프로그래밍" 장을 참조하세요.) 🎜rrreee🎜위 코드는 Object.prototype에 인쇄 메서드를 정의한 다음 Object 인스턴스 o를 생성합니다. o는 Object.prototype의 속성과 메서드를 직접 상속하고 이를 자체적으로 호출할 수 있습니다. 즉, o 개체의 인쇄 메서드는 기본적으로 Object.prototype.print 메서드를 호출합니다. . 🎜🎜위 두 가지 작성 방식의 인쇄 방식은 동일한 기능을 갖고 있음에도 불구하고 사용법이 다르기 때문에 "생성자 방식"과 "인스턴스 객체 방식"을 구별할 필요가 있음을 알 수 있습니다. 🎜🎜🎜Object()🎜🎜🎜객체 자체가 함수입니다. 도구 메서드로 사용하면 모든 값을 객체로 변환할 수 있습니다. 이 방법은 특정 값이 객체여야 함을 확인하는 데 자주 사용됩니다. 🎜
    • 🎜매개변수가 기본 유형 값인 경우 Object 메소드는 해당 패키징 객체의 인스턴스를 반환합니다.🎜🎜🎜rrreee🎜위 코드는 다음을 나타냅니다. Object 함수는 각 값을 해당 생성자에 의해 생성된 객체로 변환할 수 있습니다. 🎜
      • 🎜Object 메소드의 매개변수가 객체인 경우 항상 원본 객체를 반환합니다. 🎜🎜🎜rrreee🎜이를 사용하면 변수가 객체인지 판별하는 함수를 작성할 수 있습니다. 🎜rrreee🎜🎜지식 확장: 객체를 생성하는 세 가지 다른 방법🎜🎜🎜🎜1 객체 리터럴🎜🎜{… }🎜🎜🎜객체 리터럴 메서드는 가장 일반적으로 사용되는 메서드 중 하나이며 속성이 포함된 중괄호 {...}를 사용하여 객체를 빠르게 생성합니다. 🎜rrreee🎜🎜2. Object.create()🎜🎜🎜Object.create() 메소드는 새로 생성된 객체의 __proto__를 제공하기 위해 기존 객체를 사용하여 새 객체를 생성합니다. 🎜rrreeerrree🎜🎜3. Object.ass()🎜🎜🎜Object.ass() 이 방법은 객체를 생성하는 데 직접 사용되지는 않지만 객체를 생성하는 효과를 얻을 수 있으므로 여기서는 객체를 생성하는 방법으로도 사용됩니다. 🎜🎜Object.sign() 메서드는 하나 이상의 소스 개체에서 대상 개체로 모든 🎜self🎜의 🎜열거 가능한 속성🎜 값을 복사하는 데 사용됩니다. 대상 객체를 반환합니다. 🎜rrreee
        • 대상 객체나 원본 객체에 동일한 속성이 있는 경우 나중 객체의 속성이 이전 객체의 속성을 덮어씁니다. 🎜
        • 소스 객체의 열거 가능한 속성만 대상 객체에 복사됩니다. 소스 객체의 프로토타입에 있는 객체에 대해서는 처리가 수행되지 않습니다. 🎜
        • 이 메서드는 소스 개체의 Get과 대상 개체의 Set을 사용하여 값을 가져오고 설정합니다. 🎜🎜rrreee🎜【관련 추천: 🎜자바스크립트 학습 튜토리얼🎜🎜】🎜🎜

위 내용은 JavaScript에서 객체를 생성하기 위해 Object() 함수를 사용하는 방법에 대해 이야기해 보겠습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 csdn.net에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제