process on call

last-endcode · last-endcode · commit 093b607016db · 2020-12-30T17:22:58.000+07:00
diff --git a/01_object_basics.js b/01_object_basics.js
@@ -0,0 +1,31 @@
+const person = {
+  name: 'john doe',
+  age: 25,
+  married: true,
+  siblings: ['anna', 'peter'],
+  greet: function (name) {
+    return `hello, my name is ${name}`;
+  },
+  sayHello(name) {
+    console.log(`hello, my name is ${name}`);
+  },
+};
+
+// acces obj u can use dot notation
+// console.log(person.name); //john doe
+// change name john doe be peter walker
+person.name = 'peter walker';
+// console.log(person.name);
+
+// print all object
+// console.log(person);
+// access object with function parameter
+// console.log(person.greet('wiwa'));
+
+//acces obj on array
+console.log(person.siblings[person.siblings.length - 1]);
+
+// delete property
+let siblings = delete person.siblings;
+console.log(siblings); //true its succesfully for delete
+console.log(person);
diff --git a/02_nested_obj.js b/02_nested_obj.js
@@ -0,0 +1,40 @@
+const newnames = 'apple.inc';
+const age = 20;
+let random = 'random-value';
+
+const person = {
+  name: 'john doe',
+  age: age,
+  company: {
+    name: newnames,
+    job: 'front end developer',
+  },
+  married: true,
+  expert: {
+    skills: ['html', 'css3', 'js'],
+    hobby: {
+      books: ['onepiece', 'shokugeki no souma'],
+    },
+  },
+  'random-value': 'jobss!',
+};
+
+// acces all obj
+// console.log(person);
+
+// *** acces on nested
+// front end developer
+console.log(person.company.job);
+// [ 'html', 'css3', 'js' ]
+console.log(person.expert.skills);
+// shokugeki no souma
+console.log(person.expert.hobby.books[1]);
+console.log('random-value');
+// apple.inc
+console.log(person.company.name);
+console.log(person['random-value']);
+// { name: 'apple.inc', job: 'front end developer' }
+// still same with person.company
+console.log(person['company']);
+
+console.log(person.age);
diff --git a/03_this_basics.js b/03_this_basics.js
@@ -0,0 +1,10 @@
+const shp_list = {
+  firstName: 'mugiwara no',
+  lastName: 'luffy',
+  sayToHello: function () {
+    console.log(`Hello captain ${this.firstName} ${this.lastName}`);
+  },
+};
+
+// this keyword get value object dari dalam object itu sndiri
+shp_list.sayToHello();
diff --git a/04_factory_function.js b/04_factory_function.js
@@ -0,0 +1,46 @@
+// blue print
+// factory function and constructor functions
+// factory functions for return obj & based on parameter
+//
+
+//  *** remember heres not dynamic
+// here if add text i love js for john
+// its good but how for bobby, or 3000 obj with name?
+// for solution you need factory functions
+
+// const john = {
+//   firstName: 'john',
+//   lastName: 'doe',
+//   fullName: function () {
+//     console.log(`my full name is ${this.firstName} ${this.lastName}
+//     i love js`);
+//   },
+// };
+
+// const bob = {
+//   firstName: 'bob',
+//   lastName: 'walker',
+//   fullName: function () {
+//     console.log(`my full name is ${this.firstName} ${this.lastName}`);
+//   },
+// };
+
+// ***** Factory Function
+function createPerson(firstName, lastName) {
+  return {
+    firstName: firstName,
+    lastName: lastName,
+    fullName: function () {
+      console.log(`My name is ${this.firstName} ${this.lastName} i love JS`);
+    },
+  };
+}
+
+const john = createPerson('john', 'doe');
+john.fullName();
+const bob = createPerson('bob', 'walker');
+bob.fullName();
+const susy = createPerson('susy', 'kane');
+susy.fullName();
+const kelly = createPerson('kelly', 'jane');
+kelly.fullName();
diff --git a/05_constructor_function.js b/05_constructor_function.js
@@ -0,0 +1,19 @@
+// constructor function
+// new - creates new object, points to it, omit return
+function person(firstName, lastName) {
+  this.firstName = firstName;
+  this.lastName = lastName;
+  this.fullName = function () {
+    console.log(`my full name is ${this.firstName} ${this.lastName}`);
+  };
+  console.log(this);
+}
+
+// access obj use new
+
+const john = new person('john', 'doe');
+john.fullName();
+const boby = new person('boby', 'walker');
+boby.fullName();
+const susy = new person('susy', 'dane');
+susy.fullName();
diff --git a/06_constructor_property.js b/06_constructor_property.js
@@ -0,0 +1,31 @@
+// all objects in JS have access to constructor
+// property that returuns a constructor function that created it
+// built in constructor function
+// arrays and functions are object in JS
+
+function person(firstName, lastName) {
+  this.firstName = firstName;
+  this.lastName = lastName;
+  this.fullName = function () {
+    console.log(
+      `my full name is ${this.firstName} ${this.lastName}, i love JS`
+    );
+  };
+}
+
+// here example constructor function
+// *** obj, array, function
+
+const john = new person('john', 'doe');
+// console.log(john.constructor);
+
+const bob = {};
+console.log(bob.constructor);
+const list = [];
+console.log(list.constructor);
+const peter = function () {};
+console.log(peter);
+
+// example here can new instance will same constructor
+const jane = new john.constructor('jane', 'edward');
+jane.fullName();
diff --git a/07_prototype_property.js b/07_prototype_property.js
@@ -0,0 +1,25 @@
+function Banking(fullName, initialBalance) {
+  this.name = fullName;
+  this.balance = initialBalance;
+  // function
+}
+
+// here you can create New prototype
+Banking.prototype.bank = 'Mandiri';
+Banking.prototype.deposit = function (amount) {
+  this.balance += amount;
+  console.log(
+    `Hello ${this.name} your balance on the bank ${this.bank} for now  is ${this.balance}`
+  );
+};
+const kelly = new Banking('kelly', 2000);
+const jane = new Banking('jane', 0);
+
+console.log(kelly);
+console.log(jane);
+kelly.deposit(2200);
+jane.deposit(10560000);
+
+// output:
+// Hello kelly your balance on the bank Mandiri for now  is 4200
+// Hello jane your balance on the bank Mandiri for now  is 10560000
diff --git a/08_ES6_Class_syntax.js b/08_ES6_Class_syntax.js
@@ -0,0 +1,29 @@
+// ES6
+// Basic constructor 01-07 chapter
+
+class Account {
+  // constructor
+  constructor(fullName, initialBalance) {
+    this.name = fullName;
+    this.balance = initialBalance;
+  }
+  // prototype here will input to constructor
+  bank = 'Mandiri Indonesia';
+  // function
+  deposite(amount) {
+    this.balance += amount;
+    console.log(
+      `Hello ${this.name} your balance on ${this.bank} is Rp. ${this.balance} `
+    );
+  }
+}
+
+// field object don't forget create new
+const kelly = new Account('kelly jane', 20000);
+console.log(kelly);
+kelly.deposite(40000);
+// output: Hello kelly jane your balance on Mandiri Indonesia is Rp. 60000
+
+const jenny = new Account('jenny edward', 15000);
+jenny.deposite(15000);
+// Hello jenny edward your balance on Mandiri Indonesia is Rp. 30000
diff --git a/09.call.js b/09.call.js
@@ -0,0 +1,33 @@
+// call method,
+// you can write a method that can be used on different objects.
+
+const john = {
+  name: 'john',
+  age: 25,
+  greeting: function () {
+    console.log(this);
+    console.log(`My name is ${this.name} and my age is ${this.age}`);
+  },
+};
+
+const susy = {
+  name: 'susy',
+  age: 30,
+};
+
+// u can use two option: like function this
+// or use object
+function greeting() {
+  console.log(this);
+  console.log(`Your name is ${this.name} and age is ${this.age}`);
+}
+
+greeting.call(susy);
+// Your name is susy and age is 30
+
+// or you can use this one
+john.greeting.call(susy);
+// My name is susy and my age is 30
+
+// and for create again use argument
+john.greeting.call({ name: 'peter walker', age: 68 });
diff --git a/index.html b/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Document</title>
+  </head>
+  <body>
+    <h2>constructor function</h2>
+  </body>
+  <script src="./09.call.js"></script>
+</html>
