Skip to content

object Part 1

JS Object

Features:

  1. reference type.
  2. Change property after object has been created. eg:
  3. refer Class property inside function using this. else it wont work.
  4. Side note : Each Objeect we create by any mean will have a prototype. default prototype is Object.prototype which is root prototype of all objects.

A. Object basics

  1. accessing its property

1.1. using .

img

1.2. accessing its propertyusing ['abc']//abc is property.

  1. add another object as property.

  2. Add Function in object. Notice : instead of =.

  3. using string as property name. by this we can use - as well in var name. if use it directly it will give error.

  4. Create object using new object() - this is not preferred.

  5. Create object using prototype - Object.create(prototype)

  6. camparing objects using == it checks references.


B. PROTOTYPE

  1. Blueprints from where we can create multiple object and benefits its functions and feilds
  2. Object.prototype (itself a object) is parent prtotype. try to priny itlog(Object.prototype ) //undefined
  3. var1.anything() --> error; var1.toString() --> no error. how ?
  4. prototype can be think of as parent Object and can be used inside objects(created from prototype).
  5. Object.prototype is parent all object and all its method accessible to object derived from it.
  6. eg : to understand it more better:
  7. Protyotype Chain:

  8. var chilhObj = Object.create(parentObj)

  9. Create multiple object from same blueprint

    var chilhObj1 = Object.create(parentObj);
    var chilhObj2= Object.create(parentObj);
    

  10. Get prototype:

    var a = Object.create(x);
    Object.getPrototypeOf(a) //x
    


C. Constructor Functions

  1. Another way to create Object.
  2. eg:
    function ABC(){ ... }
    var o1 = new ABC();
    
    //protype of  o1 will be ABC.protype.
    
    ABC.prototype.greet = function(){ log("hello");}
    
    o1.greet() // hello.
    var a =
    
  1. constrtor function with argument.

this keyword

its little trick in JS, but we can handle it.

  1. binding
    function f1(){ console.log(this)} 
    
    case1: invoke globally
    f1() // it will print window object. here this is bind with window object.
    
    case 2: invoke inside object
    var obj = { x : f1 ; }
    obj.x(); // it will print obj. here this is bind with obj.
    
    Using bind() function we can bind any object with this of function f1(){ console.log(this)}.

eg:

var obj = { x : f1 ; }
obj.x.bind(this); // here this is bind with obj again.

note: parenthesis is omitted after x.

var obj2 = { ... }
obj.x.bind(obj2); // here this is bind with obj2 but wont we called.

obj.x.bind(obj2)();//will be called here. Added parenthesis at end.

  1. passing arg while binding

    function f1(arg1,...){ console.log(arg1 + this)} 
    
    var obj = { x : f1 ; }
    obj.x.bind(this,"arg1", ...)(); // 2nd arg onwards.
    

  2. Call() method

  3. it binds and call.
  4. no need to put addiotional parenthesis at end.

  5. apply() method

  6. same as call but it accepts argument in array.

defineProperty

Object.defineProperty(...) --> Add new property in object.

way1: img

way2: img - its complex, but it provides some more configuration. - 3rd argument is object --> {value: " " or f1(){}, writable: T/F, ...} - by default value is readable. img - make it writable to update it. img

  • other properties which 3rd argument (object) accepts other than value, writable :

  • get: below below will be called whenever 'name' is accessed. img

set: below below will be called whenever 'name' is accessed. img

google other ...


clear some property of object

  1. assign null
  2. delete : img

check if property is present inside object

img Note : Name - false, name - true


Iterate through all feilds:

feild name: img

feild values: img