DEV Community

bappasaha
bappasaha

Posted on

Class in JavaScript

đŸ”ĨđŸ”ĨđŸ”Ĩ Class

class Box{

    constructor(color) {
        this.color =color;
    }

    getColor(){
        return this.color;
    }
    setColor(color){
        this.color =color
    }
}

let b1 =new Box('green');
let b2 =new Box('red');

console.log(b1.color)
console.log(b2.color)

Enter fullscreen mode Exit fullscreen mode

āĻ•ā§āĻ˛āĻžāĻ¸ āĻ¸āĻŽā§āĻĒāĻ°ā§āĻ•ā§‡

āĻ•ā§āĻ˛āĻžāĻ¸ āĻšāĻ˛ āĻ…āĻŦāĻœā§‡āĻ•ā§āĻŸ-āĻ…āĻ°āĻŋāĻ¯āĻŧā§‡āĻ¨ā§āĻŸā§‡āĻĄ āĻĒā§āĻ°ā§‹āĻ—ā§āĻ°āĻžāĻŽāĻŋāĻ‚āĻ¯āĻŧā§‡āĻ° (OOP) āĻāĻ•āĻŸāĻŋ āĻŽā§ŒāĻ˛āĻŋāĻ• āĻ§āĻžāĻ°āĻŖāĻžāĨ¤ āĻāĻŸāĻŋ āĻ…āĻŦāĻœā§‡āĻ•ā§āĻŸ āĻ¤ā§ˆāĻ°āĻŋ āĻ•āĻ°āĻžāĻ° āĻœāĻ¨ā§āĻ¯ āĻāĻ•āĻŸāĻŋ āĻŦā§āĻ˛ā§āĻĒā§āĻ°āĻŋāĻ¨ā§āĻŸ āĻšāĻŋāĻ¸āĻžāĻŦā§‡ āĻ•āĻžāĻœ āĻ•āĻ°ā§‡, āĻ¯āĻž āĻĄā§‡āĻŸāĻž āĻāĻŦāĻ‚ āĻ¸ā§‡āĻ‡ āĻĄā§‡āĻŸāĻž āĻĒāĻ°āĻŋāĻšāĻžāĻ˛āĻ¨āĻžāĻ° āĻœāĻ¨ā§āĻ¯ āĻĒāĻĻā§āĻ§āĻ¤āĻŋāĻ—ā§āĻ˛āĻŋ āĻāĻ•āĻ¤ā§āĻ°āĻŋāĻ¤ āĻ•āĻ°ā§‡āĨ¤

āĻ•ā§āĻ˛āĻžāĻ¸ā§‡āĻ° āĻ‰āĻĻāĻžāĻšāĻ°āĻŖ: āĻ•ā§āĻ•āĻŋ āĻ•ā§āĻ˛āĻžāĻ¸

class Cookie {
    constructor(color) {
        this.color = color; // 'this' āĻ•ā§€āĻ“āĻ¯āĻŧāĻžāĻ°ā§āĻĄ āĻ•ā§āĻ•āĻŋāĻ° āĻ¨āĻŋāĻ°ā§āĻĻāĻŋāĻˇā§āĻŸ āĻ‡āĻ¨āĻ¸ā§āĻŸā§āĻ¯āĻžāĻ¨ā§āĻ¸āĻ•ā§‡ āĻ¨āĻŋāĻ°ā§āĻĻā§‡āĻļ āĻ•āĻ°ā§‡āĨ¤
    }
}
Enter fullscreen mode Exit fullscreen mode
  • āĻ•āĻ¨āĻ¸ā§āĻŸā§āĻ°āĻžāĻ•ā§āĻŸāĻ°: āĻ•āĻ¨āĻ¸ā§āĻŸā§āĻ°āĻžāĻ•ā§āĻŸāĻ° āĻŽā§‡āĻĨāĻĄāĻŸāĻŋ āĻāĻ•āĻŸāĻŋ āĻ¨āĻ¤ā§āĻ¨ āĻ‡āĻ¨āĻ¸ā§āĻŸā§āĻ¯āĻžāĻ¨ā§āĻ¸ āĻ¤ā§ˆāĻ°āĻŋ āĻ•āĻ°āĻžāĻ° āĻ¸āĻŽāĻ¯āĻŧ āĻ•āĻ˛ āĻšāĻ¯āĻŧāĨ¤ āĻāĻ–āĻžāĻ¨ā§‡ āĻāĻŸāĻŋ āĻāĻ•āĻŸāĻŋ color āĻĒā§āĻ¯āĻžāĻ°āĻžāĻŽāĻŋāĻŸāĻžāĻ° āĻ—ā§āĻ°āĻšāĻŖ āĻ•āĻ°ā§‡ āĻāĻŦāĻ‚ āĻāĻŸāĻŋāĻ•ā§‡ āĻ‡āĻ¨āĻ¸ā§āĻŸā§āĻ¯āĻžāĻ¨ā§āĻ¸ āĻ­ā§‡āĻ°āĻŋāĻ¯āĻŧā§‡āĻŦāĻ˛ this.color āĻ āĻ…ā§āĻ¯āĻžāĻ¸āĻžāĻ‡āĻ¨ āĻ•āĻ°ā§‡āĨ¤

āĻ‡āĻ¨āĻ¸ā§āĻŸā§āĻ¯āĻžāĻ¨ā§āĻ¸ āĻ¤ā§ˆāĻ°āĻŋ āĻ•āĻ°āĻž

new āĻ•ā§€āĻ“āĻ¯āĻŧāĻžāĻ°ā§āĻĄ āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ° āĻ•āĻ°ā§‡ āĻ•ā§āĻ˛āĻžāĻ¸ā§‡āĻ° āĻ‡āĻ¨āĻ¸ā§āĻŸā§āĻ¯āĻžāĻ¨ā§āĻ¸ āĻ¤ā§ˆāĻ°āĻŋ āĻ•āĻ°āĻž āĻ¯āĻžāĻ¯āĻŧ:

let cookieOne = new Cookie("green"); // āĻāĻ•āĻŸāĻŋ āĻ¸āĻŦā§āĻœ āĻ•ā§āĻ•āĻŋ āĻ¤ā§ˆāĻ°āĻŋ āĻ•āĻ°ā§‡
let cookieTwo = new Cookie("blue");   // āĻāĻ•āĻŸāĻŋ āĻ¨ā§€āĻ˛ āĻ•ā§āĻ•āĻŋ āĻ¤ā§ˆāĻ°āĻŋ āĻ•āĻ°ā§‡
Enter fullscreen mode Exit fullscreen mode
  • āĻ‡āĻ¨āĻ¸ā§āĻŸā§āĻ¯āĻžāĻ¨ā§āĻ¸: cookieOne āĻāĻŦāĻ‚ cookieTwo āĻšāĻ˛ Cookie āĻ•ā§āĻ˛āĻžāĻ¸ā§‡āĻ° āĻ¨āĻŋāĻ°ā§āĻĻāĻŋāĻˇā§āĻŸ āĻ‡āĻ¨āĻ¸ā§āĻŸā§āĻ¯āĻžāĻ¨ā§āĻ¸, āĻĒā§āĻ°āĻ¤āĻŋāĻŸāĻŋāĻ° āĻ¨āĻŋāĻœāĻ¸ā§āĻŦ āĻ°āĻ™ā§‡āĻ° āĻŦā§ˆāĻļāĻŋāĻˇā§āĻŸā§āĻ¯ āĻ°āĻ¯āĻŧā§‡āĻ›ā§‡āĨ¤

āĻŦā§ˆāĻļāĻŋāĻˇā§āĻŸā§āĻ¯ āĻāĻŦāĻ‚ āĻĒāĻĻā§āĻ§āĻ¤āĻŋāĻ—ā§āĻ˛āĻŋ āĻ…ā§āĻ¯āĻžāĻ•ā§āĻ¸ā§‡āĻ¸ āĻ•āĻ°āĻž

āĻ•ā§āĻ˛āĻžāĻ¸ā§‡āĻ° āĻŽāĻ§ā§āĻ¯ā§‡ āĻĒāĻĻā§āĻ§āĻ¤āĻŋ āĻ¸āĻ‚āĻœā§āĻžāĻžāĻ¯āĻŧāĻŋāĻ¤ āĻ•āĻ°āĻž āĻ¯āĻžāĻ¯āĻŧ āĻ¯āĻžāĻ¤ā§‡ āĻ¤āĻžāĻ° āĻŦā§ˆāĻļāĻŋāĻˇā§āĻŸā§āĻ¯āĻ—ā§āĻ˛āĻŋāĻ° āĻ¸āĻžāĻĨā§‡ āĻ¯ā§‹āĻ—āĻžāĻ¯ā§‹āĻ— āĻ•āĻ°āĻž āĻ¯āĻžāĻ¯āĻŧāĨ¤ āĻ¸āĻžāĻ§āĻžāĻ°āĻŖ āĻĒāĻĻā§āĻ§āĻ¤āĻŋāĻ—ā§āĻ˛āĻŋāĻ° āĻŽāĻ§ā§āĻ¯ā§‡ āĻ—ā§‡āĻŸāĻžāĻ° āĻāĻŦāĻ‚ āĻ¸ā§‡āĻŸāĻžāĻ° āĻ…āĻ¨ā§āĻ¤āĻ°ā§āĻ­ā§āĻ•ā§āĻ¤āĨ¤

āĻ—ā§‡āĻŸāĻžāĻ° āĻāĻŦāĻ‚ āĻ¸ā§‡āĻŸāĻžāĻ°

class Cookie {
    constructor(color) {
        this.color = color;
    }

    getColor() {
        return this.color; // āĻ•ā§āĻ•āĻŋāĻ° āĻ°āĻ™ āĻĢā§‡āĻ°āĻ¤ āĻĻā§‡āĻ¯āĻŧ
    }

    setColor(newColor) {
        this.color = newColor; // āĻ•ā§āĻ•āĻŋāĻ° āĻ°āĻ™ āĻ†āĻĒāĻĄā§‡āĻŸ āĻ•āĻ°ā§‡
    }
}
Enter fullscreen mode Exit fullscreen mode
  • āĻ—ā§‡āĻŸ āĻ°āĻ™: āĻ†āĻĒāĻ¨āĻŋ āĻāĻ•āĻŸāĻŋ āĻ¨āĻŋāĻ°ā§āĻĻāĻŋāĻˇā§āĻŸ āĻ•ā§āĻ•āĻŋāĻ° āĻ°āĻ™ āĻ‰āĻĻā§āĻ§āĻžāĻ° āĻ•āĻ°āĻ¤ā§‡ āĻĒāĻžāĻ°ā§‡āĻ¨āĨ¤
  • āĻ¸ā§‡āĻŸ āĻ°āĻ™: āĻ†āĻĒāĻ¨āĻŋ āĻāĻ•āĻŸāĻŋ āĻ¨āĻŋāĻ°ā§āĻĻāĻŋāĻˇā§āĻŸ āĻ•ā§āĻ•āĻŋāĻ° āĻ°āĻ™ āĻĒāĻ°āĻŋāĻŦāĻ°ā§āĻ¤āĻ¨ āĻ•āĻ°āĻ¤ā§‡ āĻĒāĻžāĻ°ā§‡āĻ¨āĨ¤

āĻ‰āĻĻāĻžāĻšāĻ°āĻŖ āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ°

console.log(cookieOne.getColor()); // āĻ†āĻ‰āĻŸāĻĒā§āĻŸ: green
cookieOne.setColor("yellow");
console.log(cookieOne.getColor()); // āĻ†āĻ‰āĻŸāĻĒā§āĻŸ: yellow
Enter fullscreen mode Exit fullscreen mode

āĻĄā§‡āĻŸāĻž āĻ¸ā§āĻŸā§āĻ°āĻžāĻ•āĻšāĻžāĻ°āĻ—ā§āĻ˛āĻŋāĻ¤ā§‡ āĻ¸āĻŽā§āĻĒā§āĻ°āĻ¸āĻžāĻ°āĻŖ: āĻ˛āĻŋāĻ™ā§āĻ•āĻĄ āĻ˛āĻŋāĻ¸ā§āĻŸ āĻ•ā§āĻ˛āĻžāĻ¸

āĻ•ā§āĻ˛āĻžāĻ¸āĻ—ā§āĻ˛āĻŋ āĻļā§āĻ§ā§āĻŽāĻžāĻ¤ā§āĻ° āĻ¸āĻžāĻ§āĻžāĻ°āĻŖ āĻ…āĻŦāĻœā§‡āĻ•ā§āĻŸ āĻ¯ā§‡āĻŽāĻ¨ āĻ•ā§āĻ•āĻŋāĻ° āĻœāĻ¨ā§āĻ¯ āĻ¸ā§€āĻŽāĻžāĻŦāĻĻā§āĻ§ āĻ¨āĻ¯āĻŧ; āĻāĻ—ā§āĻ˛āĻŋ āĻœāĻŸāĻŋāĻ˛ āĻĄā§‡āĻŸāĻž āĻ¸ā§āĻŸā§āĻ°āĻžāĻ•āĻšāĻžāĻ° āĻ¯ā§‡āĻŽāĻ¨ āĻ˛āĻŋāĻ™ā§āĻ•āĻĄ āĻ˛āĻŋāĻ¸ā§āĻŸ āĻ¤ā§ˆāĻ°āĻŋ āĻ•āĻ°āĻ¤ā§‡ āĻŦā§āĻ¯āĻŦāĻšā§ƒāĻ¤ āĻšāĻ¤ā§‡ āĻĒāĻžāĻ°ā§‡āĨ¤

āĻ˛āĻŋāĻ™ā§āĻ•āĻĄ āĻ˛āĻŋāĻ¸ā§āĻŸ āĻ•ā§āĻ˛āĻžāĻ¸ā§‡āĻ° āĻ¸āĻžāĻ°āĻ¸āĻ‚āĻ•ā§āĻˇā§‡āĻĒ

class LinkedList {
    constructor(value) {
        this.head = { value: value, next: null }; // āĻšā§‡āĻĄ āĻ¨ā§‹āĻĄ āĻļā§āĻ°ā§ āĻ•āĻ°āĻž
        this.length = 1; // āĻĻā§ˆāĻ°ā§āĻ˜ā§āĻ¯ āĻŸā§āĻ°ā§āĻ¯āĻžāĻ• āĻ•āĻ°āĻž
    }

    push(value) {
        // āĻļā§‡āĻˇā§‡āĻ° āĻĻāĻŋāĻ•ā§‡ āĻ¨āĻ¤ā§āĻ¨ āĻ¨ā§‹āĻĄ āĻ¯ā§‹āĻ— āĻ•āĻ°āĻžāĻ° āĻŽā§‡āĻĨāĻĄ
    }

    unshift(value) {
        // āĻļā§āĻ°ā§āĻ¤ā§‡ āĻ¨āĻ¤ā§āĻ¨ āĻ¨ā§‹āĻĄ āĻ¯ā§‹āĻ— āĻ•āĻ°āĻžāĻ° āĻŽā§‡āĻĨāĻĄ
    }

    insertAt(index, value) {
        // āĻ¨āĻŋāĻ°ā§āĻĻāĻŋāĻˇā§āĻŸ āĻ¸ā§‚āĻšāĻ•ā§‡ āĻāĻ•āĻŸāĻŋ āĻ¨ā§‹āĻĄ āĻ¸āĻ¨ā§āĻ¨āĻŋāĻŦā§‡āĻļ āĻ•āĻ°āĻžāĻ° āĻŽā§‡āĻĨāĻĄ
    }

    remove(index) {
        // āĻ¨āĻŋāĻ°ā§āĻĻāĻŋāĻˇā§āĻŸ āĻ¸ā§‚āĻšāĻ• āĻĨā§‡āĻ•ā§‡ āĻāĻ•āĻŸāĻŋ āĻ¨ā§‹āĻĄ āĻ…āĻĒāĻ¸āĻžāĻ°āĻŖ āĻ•āĻ°āĻžāĻ° āĻŽā§‡āĻĨāĻĄ
    }

    pop() {
        // āĻļā§‡āĻˇ āĻ¨ā§‹āĻĄ āĻ…āĻĒāĻ¸āĻžāĻ°āĻŖ āĻ•āĻ°āĻžāĻ° āĻŽā§‡āĻĨāĻĄ
    }

    shift() {
        // āĻĒā§āĻ°āĻĨāĻŽ āĻ¨ā§‹āĻĄ āĻ…āĻĒāĻ¸āĻžāĻ°āĻŖ āĻ•āĻ°āĻžāĻ° āĻŽā§‡āĻĨāĻĄ
    }
}
Enter fullscreen mode Exit fullscreen mode

āĻ˛āĻŋāĻ™ā§āĻ•āĻĄ āĻ˛āĻŋāĻ¸ā§āĻŸā§‡āĻ° āĻ‰āĻĻāĻžāĻšāĻ°āĻŖ āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ°

let myLinkedList = new LinkedList(23); // āĻĒā§āĻ°āĻĨāĻŽ āĻ¨ā§‹āĻĄā§‡āĻ° āĻŽāĻžāĻ¨ 23 āĻĻāĻŋāĻ¯āĻŧā§‡ āĻ˛āĻŋāĻ™ā§āĻ•āĻĄ āĻ˛āĻŋāĻ¸ā§āĻŸ āĻ¤ā§ˆāĻ°āĻŋ āĻ•āĻ°ā§‡
myLinkedList.push(7);                    // āĻļā§‡āĻˇā§‡ 7 āĻ¯ā§‹āĻ— āĻ•āĻ°ā§‡
myLinkedList.unshift(3);                 // āĻļā§āĻ°ā§āĻ¤ā§‡ 3 āĻ¯ā§‹āĻ— āĻ•āĻ°ā§‡
myLinkedList.insertAt(1, 11);            // āĻ¸ā§‚āĻšāĻ• 1 āĻ 11 āĻ¸āĻ¨ā§āĻ¨āĻŋāĻŦā§‡āĻļ āĻ•āĻ°ā§‡
myLinkedList.remove(1);                  // āĻ¸ā§‚āĻšāĻ• 1 āĻĨā§‡āĻ•ā§‡ āĻ†āĻ‡āĻŸā§‡āĻŽ āĻ…āĻĒāĻ¸āĻžāĻ°āĻŖ āĻ•āĻ°ā§‡ (11)
Enter fullscreen mode Exit fullscreen mode

āĻ‰āĻĒāĻ¸āĻ‚āĻšāĻžāĻ°

āĻ•ā§āĻ˛āĻžāĻ¸āĻ—ā§āĻ˛āĻŋ āĻ†āĻĒāĻ¨āĻžāĻ° āĻ•ā§‹āĻĄāĻ•ā§‡ āĻ•āĻžāĻ āĻžāĻŽā§‹āĻŦāĻĻā§āĻ§ āĻ•āĻ°āĻžāĻ° āĻœāĻ¨ā§āĻ¯ āĻāĻ•āĻŸāĻŋ āĻļāĻ•ā§āĻ¤āĻŋāĻļāĻžāĻ˛ā§€ āĻ‰āĻĒāĻžāĻ¯āĻŧ āĻĒā§āĻ°āĻĻāĻžāĻ¨ āĻ•āĻ°ā§‡, āĻ¯āĻž āĻāĻŸāĻŋ āĻŽāĻĄā§āĻ˛āĻžāĻ° āĻāĻŦāĻ‚ āĻĒā§āĻ¨āĻƒāĻŦā§āĻ¯āĻŦāĻšāĻžāĻ°āĻ¯ā§‹āĻ—ā§āĻ¯ āĻ•āĻ°ā§‡ āĻ¤ā§‹āĻ˛ā§‡āĨ¤ āĻ¤āĻžāĻ°āĻž āĻ†āĻĒāĻ¨āĻžāĻ•ā§‡ āĻĄā§‡āĻŸāĻž āĻāĻŦāĻ‚ āĻ†āĻšāĻ°āĻŖ āĻ‰āĻ­āĻ¯āĻŧāĻ‡ āĻ¸āĻ‚āĻœā§āĻžāĻžāĻ¯āĻŧāĻŋāĻ¤ āĻ•āĻ°āĻ¤ā§‡ āĻĻā§‡āĻ¯āĻŧ, āĻ¯āĻž āĻœāĻŸāĻŋāĻ˛ āĻ…ā§āĻ¯āĻžāĻĒā§āĻ˛āĻŋāĻ•ā§‡āĻļāĻ¨ āĻ¤ā§ˆāĻ°āĻŋ āĻ•āĻ°āĻžāĻ° āĻœāĻ¨ā§āĻ¯ āĻ…āĻĒāĻ°āĻŋāĻšāĻžāĻ°ā§āĻ¯āĨ¤ āĻ•ā§āĻ˛āĻžāĻ¸āĻ—ā§āĻ˛āĻŋ āĻ¸āĻŽā§āĻĒāĻ°ā§āĻ•ā§‡ āĻāĻ‡ āĻŽā§ŒāĻ˛āĻŋāĻ• āĻœā§āĻžāĻžāĻ¨ āĻ†āĻĒāĻ¨āĻžāĻ•ā§‡ āĻĒā§āĻ°ā§‹āĻ—ā§āĻ°āĻžāĻŽāĻŋāĻ‚āĻ¯āĻŧā§‡āĻ° āĻŦāĻŋāĻ­āĻŋāĻ¨ā§āĻ¨ āĻšā§āĻ¯āĻžāĻ˛ā§‡āĻžā§āĻœ āĻŽā§‹āĻ•āĻžāĻŦā§‡āĻ˛āĻžāĻ¯āĻŧ āĻĒā§āĻ°āĻ¸ā§āĻ¤ā§āĻ¤ āĻ•āĻ°āĻŦā§‡!

Sentry image

Hands-on debugging session: instrument, monitor, and fix

Join Lazar for a hands-on session where you’ll build it, break it, debug it, and fix it. You’ll set up Sentry, track errors, use Session Replay and Tracing, and leverage some good ol’ AI to find and fix issues fast.

RSVP here →

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

👋 Kindness is contagious

Please leave a ❤ī¸ or a friendly comment on this post if you found it helpful!

Okay