ReasonJun

javascript : prototype (3) (Object.create(), Object.assign()) 본문

Frontend/Javasciprt

javascript : prototype (3) (Object.create(), Object.assign())

ReasonJun 2023. 6. 8. 00:40
728x90

Object.create()

Object.create() is a static method in JavaScript that creates a new object with the specified prototype object and properties. It allows you to create an object and explicitly set its prototype.

 

The basic syntax for using Object.create() is as follows:

Object.create(proto, [propertiesObject])
  • proto: The object that will be the prototype of the newly created object. It can be null or an existing object. The newly created object will inherit properties from this prototype object.
  • propertiesObject (optional): An object that defines additional properties to be added to the newly created object. Each property is defined as an own property descriptor. This argument can be null or an object containing property descriptors, including properties' values, getters, setters, and attributes.

Here's an example that demonstrates the usage of Object.create():

const personPrototype = {
  greetings() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

const john = Object.create(personPrototype);
john.name = 'John';
john.greetings();
// Output: Hello, my name is John

In this example, personPrototype is an object that serves as the prototype for the john object created using Object.create(). The john object inherits the greetings() method from the personPrototype, and a name property is added directly to the john object.

 

By using Object.create(), you can create objects that inherit properties and methods from a shared prototype object. This allows for prototypal inheritance in JavaScript, where objects can delegate behavior to a common prototype rather than duplicating it in each instance.

 

It's important to note that Object.create() does not invoke a constructor function or initialize the object's properties like the new keyword does with constructor functions. It creates a new object with the provided prototype directly. If you need to initialize the object's properties, you would need to do so manually after creating the object.

 

Object.assign()

Object.assign is a static method in JavaScript that is used to copy the values of all enumerable properties from one or more source objects to a target object. It allows you to merge the properties of multiple objects into a single object.

The basic syntax for using Object.assign is as follows:

Object.assign(target, ...sources)
  • target: The target object to which the properties will be copied. It is the object that receives the properties.
  • sources: One or more source objects from which the properties will be copied. You can provide multiple source objects separated by commas.
const target = {};
const source1 = { name: 'John' };
const source2 = { age: 25 };
const source3 = { gender: 'male' };

Object.assign(target, source1, source2, source3);

console.log(target);
// Output: { name: 'John', age: 25, gender: 'male' }

In this example, Object.assign copies the properties from source1, source2, and source3 to the target object. The target object ends up with the merged properties from all the source objects.

 

It's important to note that Object.assign only performs a shallow copy. If a property value is an object or an array, it is copied by reference, meaning changes to the original object will be reflected in the copied object and vice versa. If you need a deep copy, you would need to implement a custom solution or use a library.

728x90
Comments