import ReactDOM from 'react-dom';
import React from 'react';
ReactDOM and React both are objects.
'react-dom' are interacting with the DOM.
In javascript:โ
class Room{
doors(){
console.log("doors are blacks");
}
}
class House extends Room{
things(){
console.log("essential material");
}
}
const myHouse = new House();
myHouse.doors();
class House inherit kar rahi hai class Room ki properties.
In React:โ-
class Box extends React.Component{
//code goes here
}
class Box inherit all the properties of the class React.Component ki.
class Room{
doors(){
console.log("doors are blacks");
}
}
class House extends Room{
things(){
console.log("essential material");
}
}
const myHome = new House();
myHome.things();
myHome.doors();
myHome;
Note:โif we call
House; or
console.log(House) or
House(); its give an error.
House is a class object and object ko direct call nahi kar sakte isliye House ko ek function banate hai new ke sath or ek varible main store kar lete hai.ab use varible ko call kar sakte hai. like this
const myHome = new House();
myHome.things();
myHome.doors();
myHome;
object have two property or can say object is a collection of variables and functions.
1- variable
2-function/ action to perform any task
in React:โโ
class Box extends React.Component{
constructor();
}
1-constructor ka use us class ka object initialize karne ke liye karte hai.or
2-constructor is a special metod of a class for creating and initializing an object of that class.
Syntax:-
constructor(argument0, argument1) { โฆ }
class components can access their props() or their properties with the (this.props) object.
in Javascript:โโ
class House {
constructor( gates, garden ) {
this.gates = gates;
this.garden = garden;
}
openDoor() {
console.log(this.gates, 'Door is openingโฆ');
}
}
const myHome= new House(8,2);
console.log(myHome.gates);
console.log(myHome.garden);
console.log(myHome.openDoor());
console.log(myHome);
example:-2
class Polygon {
constructor(length, name) {
this.length = length;
this.name = 'Polygon';
}
myname() {
console.log("Hi i am"+ " " +this.name);
}
}
const poly = new Polygon(60);
console.log(poly);
poly.myname();
class Square extends Polygon{
constructor(width, height){
this.width = width;
this.height = height;
}
area() {
console.log(this.height * this.width);
}
}
const squar = new Square(10,20);
console.log(squar);
squar.area();
class in css for selecting elemnt and
class in java script is object
class LargeHouse extends House {
constructor(props) {
super(props);
this.bigGate = props.bigGate;
}
bigGateOpen() {
console.log(this.gates, 'Door is openingโฆ, here number of', this.bigGate);
}
}
const myLargeHouse = new LargeHouse((gates: 10, bigGate: 2);
myLargeHouse.bigGateOpen();