Arrays and Objects

Supriya

Arrays:

Arrays are regular objects for which there is a particular relationship between integer-key-ed properties and the length property.

let num = [15, 45, 78];
let oddNumbers = new Array(3,5,7);

let typesOfButterflies = ["Monarch", "Black Swallotail", "Red Admiral"];
let arrayWithAllDataTypes = [45, "number", {"0" : true, "1" : false}, null, undefined, [23, "Ron"], new Date()];

Array operations:

  • length
  • indexOf
  • concatenate
  • splice
  • push / pop
  • shift / unshift
  • reverse
  • sort
let typesOfDataTypes = [45, "number", {"0" : true, "1" : false}, null, undefined, [23, "Zlith"], new Date()];

console.log(typesOfDataTypes.length);

console.log(typesOfDataTypes.indexOf(null));

Array operations:

let carnivorousAnimals = ["panther", "puma", "wolf", "hyena"];
let herbivorousAnimals = ["panda", "sloth", "deer"];

// concatinate 
let animals = carnivorousAnimals.concat(herbivorousAnimals);
// animals = herbivorousAnimals.concat(carnivorousAnimals);
console.log(animals);

/* check if the variable is an array */
let isThisAnArray = Array.isArray(carnivorousAnimals);
console.log(isThisAnArray);

/* find the index of an element in the array */
let index = carnivorousAnimals.indexOf("wolf");
console.log(index);

/* insert element at the START of the array */
animals.unshift("cheetha")
console.log(animals);
/* remove element at the START of the array */
animals.shift();
console.log(animals);

/* insert element at the END of the array */
animals.push("elephant");
console.log(animals);
/* remove element at the END of the array */
animals.pop();
console.log(animals);

/* reverse the array */
console.log(animals.reverse());

/* sort the array */
let sortedAnimals = animals.sort();
console.log("sorted Animals : ",sortedAnimals);
/* ascending order */
sortedAnimals = animals.sort((x,y)=>y-x);
console.log("descending sort : ",sortedAnimals);
/* descending order */
sortedAnimals = animals.sort((x,y)=>x-y);
console.log("ascending sort : ",sortedAnimals);

/* access particular elements in the array */
let slicedArray = sortedAnimals.splice(-2,3,"eww");
console.log(`sliced Array : ${slicedArray}`);
console.log(sortedAnimals);

Objects:

Objects are variables, which store data in a key-value pair

Example : let pokemon = { type : "water",

                                                stage : 3 }


let objectName = {
  key1 : "value1",
  key2 : 2,
  key3 : ["va", "lu", "e3"],
  key4 : {
    subKey1 : "v1",
    subkey2 : true,
    subkey3 : [23,4,"fox"]
  },
  key5 : false,
  key6 : (param) => console.log(param)
}

Creating objects :

  • Object Literals
  • Constructor
  • Object.create(objectName)
  • ES6 Classes

Object literals:

let employee = {
  name : "World's ok-ish employee",
  age : 22,
  email : "woe@pm.me",
  department : "HR"
};
let harryPotter = {
  characters : ["Harry", "Dobby", "Hermione", "Ron Weasley"],
  school : "hogwards",
  isMaigcAllowedOutsideTheCampus : false
}

Properties are inherited from Object.prototype()

function Pokemon(pokedexNo, type, evolution, rarity) {
  this.pokedexNo = pokedexNo;
  this.type = type;
  this.evolution = evolution;
  this.rarity = rarity
}

let charmander = new Pokemon(27, "fire", 2, 3);
console.log(charmander);

Constructors:

Properties are inherited from ConstructorName.prototype()

let pokemon = {
  getDetails : function (){
  console.log(`pokedex number : ${this.pokedexNo} \n
  type : ${this.type}\n
  evolution stage : ${this.evolution} \n
  rarity : ${this.rarity}`);
  }
}

let bulbasaur = Object.create(pokemon);
bulbasaur.pokedexNo = 34;
bulbasaur.type = "grass";
bulbasaur.evolution = 2;
bulbasaur.rarity = 3;

bulbasaur.getDetails();

Object.create():

All the functions get stored in the prototype

class Pokemon {
  constructor (pokedexNo, type, evolution, rarity){
    this.pokedexNo = pokedexNo;
    this.type = type;
    this.evolution = evolution,
    this.rarity = rarity
  }
  
  getDetails(){
    console.log(`pokedex number : ${this.pokedexNo} \n
    	type : ${this.type}\n
    	evolution stage : ${this.evolution} \n
    	rarity : ${this.rarity}`);
  }
}

let mew = new Pokemon(234, "magic", 4, 2);
mew.getDetails();

ES6 Classes:

Syntactic sugar for creating objects

Prototypes:

All the objects inherit the properties using prototype


let objectName = {
  key1 : "value1",
  key2 : 2,
  key3 : ["va", "lu", "e3"],
  key4 : {
    subKey1 : "v1",
    subkey2 : true,
    subkey3 : [23,4,"fox"]
  },
  key5 : false,
  key6 : (param) => console.log(param)
}

Why use a Prototype?

 
Object.prototype
{…}
​
__defineGetter__: function __defineGetter__()
​
__defineSetter__: function __defineSetter__()
​
__lookupGetter__: function __lookupGetter__()
​
__lookupSetter__: function __lookupSetter__()
​
__proto__: 
​
constructor: function Object()
​
hasOwnProperty: function hasOwnProperty()
​
isPrototypeOf: function isPrototypeOf()
​
propertyIsEnumerable: function propertyIsEnumerable()
​
toLocaleString: function toLocaleString()
​
toString: function toString()
​
valueOf: function valueOf()
​
<get __proto__()>: function __proto__()
​
<set __proto__()>: __proto__()
​​
length: 1
​​
name: "set __proto__"
​​
<prototype>: function ()



let employee = {
  name : "World's ok-ish employee",
  age : 22,
  email : "woe@pm.me",
  department : "HR",
  getInfo : function () {
    console.log(name, age, email, department);
    console.log(this.name, this.age, this.email, this.department);
  }
};

let harryPotter = {
  characters : ["Harry", "Dobby", "Hermione", "Ron Weasley"],
  school : "hogwards",
  isMaigcAllowedOutsideTheCampus : false
}

Difference between Object.create() and new

 
Made with Slides.com