Objects

Object literal: is a comma-separated list of name-value pairs wrapped in curly braces. This is considered a faster approach to creating objects.

Namespace: is a container for variables and functions. It keeps variable names from being overwritten. JS does not specifically use namespaces like other languages do, but we can do something like it using object notations.

Execution Context is created with a function is invoked. The process in which the context is being created is called the creation phase. The context determines how the code is run, or executed.

So what happens during the creation phase?

  1. Variable environment is created. Tell me what the variables are.

  2. Outer enviroment is referenced; it's lexical placement. Where am I?

  3. The this variable is created. Pay attention. This will be pointing at a different object, a different thing, depending on how the function is invoked.


  var objectName = {} // creating object 
  objectName.propertyName

  var myCar = new Object(); // creating object
  myCar.make = 'Ford';        // adding properties to object
  myCar.model = 'Mustang';
  myCar.year = 1969;

Properties of JavaScript objects can also be accessed or set using a bracket notation (for more details see property accessors). Objects are sometimes called associative arrays, since each property is associated with a string value that can be used to access it. So, for example, you could access the properties of the myCar object as follows:


  myCar['make'] = 'Ford';
  myCar['model'] = 'Mustang';
  myCar['year'] = 1969;

An object property name can be any valid JavaScript string, or anything that can be converted to a string, including the empty string

New Operator

It creates an empty object using a function and this start pointing to that context (the object)


  function Person(){

   console.log(this); // prints Person {}  
   this.firstname = 'john';
   this.lastName = 'doe';

  };

  let john = new Person();
  console.log(jhon);

If the function return a value, js won't create an empty object.


  function Person(){

   console.log(this); // prints Person {}  
   this.firstname = 'john';
   this.lastName = 'doe';

   return { test: 'testing' }
  };

  let john = new Person();
  console.log(jhon);

Few Important methods

Object.assign()

Copies the values of all enumerable own properties from one or more source objects to a target object.

Object.create()

Creates a new object with the specified prototype object and properties.

Object.defineProperty()

Adds the named property described by a given descriptor to an object.

Object.defineProperties()

Adds the named properties described by the given descriptors to an object.

Object.entries()

Returns an array of a given object’s own enumerable property [key, value] pairs.

Object.freeze()

Freezes an object: other code can’t delete or change any properties.

Prototype

Every function in js has a property called prototype, which is not the prototype of the function. This property is only used by the NEW operator. It lives only when it using a function as function constructor. ```javascript

 function Person(){

   console.log(this); // prints Person {}  
   this.firstname = 'john';
   this.lastName = 'doe';

 };

// This property is going to be added to the new objects created by using constructor function Person()
 Person.prototype.getFullName = function() {
     return this.firstname + ' ' + this.lastName;
 }

 let john = new Person();
 console.log(jhon);

It's possibe to add a property to a previously defined object type by using the prototype property. The same as Extensions in Swift language.

So, a good js practice is setup methods on the prototype property. This avoid to create the method for each object and thus, the space of memory used is less.

  • Properties on the prototype chain and non-enumerable properties cannot be copied.
  let someObj = {
    a: 2,
  }
  let obj = Object.create(someObj, { 
    b: {
      value: 2,  
    },
    c: {
      value: 3,
      enumerable: true,  
    },
  });
  let objCopy = Object.assign({}, obj);
  console.log(objCopy); // { c: 3 }

Concatenative Inheritance / Cloning / Mixins

Concatenative inheritance is the process of copying the properties from one object to another, without retaining a reference between the two objects. It relies on JavaScript’s dynamic object extension feature.

Cloning is a great way to store default state for objects: This process is commonly achieved using Object.assign().

Functional Inheritance

results matching ""

    No results matching ""