Object Oriented Programing Javascript

+++++ Prototype Di Javascript +++

prototype ini dimiliki oleh struktur data atau tipe data seperti yang telah kita gunakan dalam sebuah array atau object
Anda bisa memanggil prototypenya dengan memanggil fungsi Array.prototype

apabilamembuatobjectarrayfungsidalamprototypeseprtidibawahIni

Array.prototype.hello = () => {
console.log ('hello World');


}

() => {
console.log ('hello World');


}

const kelas 1 = [ 1,2,3]
const kelas 2 = [ 4,5,6]


kelas1.hello()

maka kedua variabel yang digunakan diatas dapat mengakses methode utama atau di parentnya dan setiap turunannya dapat dipanggil berbeda jika tidak menggunakan prototype

++++ Membuat Object Dengan Factory Function +++

// const hex = (r,g,b) => {
// return '#' + ((1 << 24) + (r << 16) + (g << 8)+ b).toString(16).slice(1); // }; // const (r,g,b) => {
// return 'rgb(${r},${g}, ${b})';
// };

function convertColor (r,g,b){
constcolor= {};
color.r=r;
color.g=g;
color.b=b;


color.rgb=function (){
const {r,g,b} =this;
return'rgb(${r},${g}, ${b})';
};
color.hex=function(){
const {r,g,b} =this;
return'#'+ ((1<<24) + (r<<16) + (g<<8)+b).toString(16).slice(1);
};




returncolor;
}

++++ Membuat Object Dengan Class ++++

cunstructor adalah fungsi yang pertama kali dijalankan saat anda membuat intsance object, pada saat kita membuat keyword new.

class color {
construtor (r,g,b, name){
this.r=r;
this.g=g;
this.b=b;
this.name=name;

}

colorName(){
console.log ('The color names is'+this.name);

}
rgb() {

const {r,g,b}=this;
return'rgb(${r},${g},${b})';

}

rgba (a=1.0){
const {r,g,b}=this;
return'rgba(${r},${g},${b},${a})';

}
hex(){
const {r,g,b}=this;
return'#'+ ((1<<24) + (r<<16) + (g<<8)+b).toString(16).slice(1);
}
}

new Color() // harus memberikan nilai pada object color kalau tidak bakalan eror

Membuatmethodeberartimembuatfungsididalamobject

jika membuat methode dengan koma, koma tanpa harus membuatnya lagi atau redudansi atau pengulangan dengan cara sebagai berikut

innerRGB(){
const {r, g, b} =this;
return'rgb(${r}, ${g}, ${b})';

}

anda masukkan ke dalam class fungsi tersebut dan bisa dinamakan method

class color {
construtor (r,g,b, name){
this.r=r;
this.g=g;
this.b=b;
this.name=name;
this.calcHSL ();

}
innerRGB(){
const {r, g, b} =this;
return'rgb(${r}, ${g}, ${b})';

}
colorName(){
console.log ('The color names is'+this.name);

}
rgb() {
return'rgb(${this.innerRGB()})';

}

rgba (a=1.0){
return'rgba(${this.innerRGB()}, ${a})';

}
hex(){
const {r,g,b}=this;
return'#'+ ((1<<24) + (r<<16) + (g<<8)+b).toString(16).slice(1);
}
hsl() {
const { h, s, l } =this;
return`hsl(${h}, ${s}%, ${l}%)`;
}

fulllySaturated() {
const { h, l } =this;
return`hsl(${h},100%, ${l}%)`;
}

opposite() {
const { h, s, l } =this;
constnewHue= (h+180) %360;
return`hsl(${newHue},${s}%, ${l}%)`;
}
calcHSL() {
let { r, g, b } =this;
// Make r, g, and b fractions of 1
r/=255;
g/=255;
b/=255;
Findgreatestandsmallestchannelvalues
letcmin=Math.min(r, g, b),
cmax=Math.max(r, g, b),
delta=cmax-cmin,
h=0,
s=0,
l=0;
if (delta==0) h=0;
elseif (cmax==r)
// Red is max
h= ((g-b) /delta) %6;
elseif (cmax==g)
// Green is max
h= (b-r) /delta+2;
// Blue is max
elseh= (r-g) /delta+4;

h=Math.round(h*60);

// Make negative hues positive behind 360°
if (h<0) h+=360;
// Calculate lightness
l= (cmax+cmin) /2;

// Calculate saturation
s=delta==0?0:delta/ (1-Math.abs(2*l-1));

// Multiply l and s by 100
s=+(s*100).toFixed(1);
l=+(l*100).toFixed(1);
this.h=h;
this.s=s;
this.l=l;
}
}

constskyColor=newColor(185, 243, 252, 'Sky');
}

Membuatsebuahmetodedalamclassitusendiridanyangmenjadisalahsatumetodenyaakanmenjalankanconstructortanpamenjalankanyanglainnya. Melakukanngeneratergbyangakandilakukanpadaformathsl

+++ OOP Extend dan Fungsi Super +++

Object ini bisa berbentuk visibel atau tidak baik itu kucing, anjing, dengan bentuk dan ukuran yang semisal kita akan membuat class kucing dengan constructer nama dan umur

classPeliharaan {
// parent class/object
constructor(name, age) {
console.log('parent executed');
this.name=name;
this.age=age;
}
makan() {
return`${this.name} lagi makan`;
}
}

constkucing=newKucing ('mbul',4)
kucing.makan()

classKucingextendsPeliharaan {
// child class/object
constructor(name, age, lives) {
console.log('child executed');
super(name, age);
this.lives=lives;
}
meong() {
return'Meeonng!';
}
}

classAnjingextendsPeliharaan {
// child class/object
gongong() {
return'guk guk!!';
}
}

extend digunakan untuk memanggil method yang digunakan oleh parentnya sedangkan untuk super untuk memanggil parameter yang ada di parent untuk digunakan di childnya.