ປະເພດ JavaScript

ECMAScript 2015, also known as ES6, introduced JavaScript class.

JavaScript class is a template for JavaScript objects.

Class of JavaScript

ຄຳວຽນ

ທ່ານຕ້ອງການໃຊ້ຄຳປະແພງ: class ການສ້າງປະເພດ.

ທ່ານຕ້ອງການເພີ່ມຊື່: constructor() method:

ຄຳວຽນ

class ClassName {
  constructor() { ... }
}

ອານຸພາສາ

class Car {
  constructor(name, year) {
    this.name = name;
    this.year = year;
  }
}

ຕົວຢ່າງຂອງນັ້ນໃຊ້ທີ່ສະໜັບສະໜູນ "Car".

ປະເພດມີຄວາມຕັ້ງພາບສະຖິຕິ "name" ແລະ "year".

ປະເພດ JavaScriptNotObject.

ມັນພຽງແຕ່ວິທະຍາສາດ JavaScript.Template.

Using Class

ຖ້າທ່ານມີປະເພດວິທະຍາສາດອີກຫຼາຍອັນ ທ່ານສາມາດໃຊ້ປະເພດວິທະຍາສາດທີ່ນັ້ນໃຫ້ສ້າງວິທະຍາສາດ:

ອານຸພາສາ

let myCar1 = new Car("Ford", 2014);
let myCar2 = new Car("Audi", 2019);

ການທົດລອງດ້ວຍຕົວຕົນ

ຕົວຢ່າງຂອງນັ້ນໃຊ້: Car Classທີ່ສ້າງສອງ. Car Object.

constructor method ແມ່ນຈະຖືກເອິ້ນໃນການສ້າງວິທະຍາສາດໃໝ່.

Constructor Method

constructor method ແມ່ນການປະກອບປະເພດພິເສດ:

  • ມັນຕ້ອງມີຊື່ພາສາທີ່ກຳພັນຫຼາຍ.
  • ທີ່ຈະມີການດຳເນີນໃນການສ້າງວິທະຍາສາດໃໝ່.
  • ທີ່ຈະສ້າງຄວາມຕັ້ງພາບຂອງວິທະຍາສາດ.
  • ຖ້າບໍ່ມີການປະກອບປະເພດຄວາມຕັ້ງພາບຄືນ constructor JavaScript ຈະເພີ່ມການປະກອບປະເພດຄືນ constructor ທີ່ບໍ່ມີຄວາມຕັ້ງພາບ.

Class Method

ການສ້າງການປະກອບປະເພດວິທະຍາສາດ.

ຄຳວຽນ

ຄືກັບການປະກອບປະເພດວິທະຍາສາດ.

ທ່ານຕ້ອງການໃຊ້ຄຳປະແພງ: class ການສ້າງປະເພດ.

ທ່ານຕ້ອງການເພີ່ມ: constructor() method.

ຫຼັງຈາກນັ້ນ ທ່ານສາມາດເພີ່ມການປະກອບປະເພດອີກຫຼາຍອັນ:

ຄຳວຽນ

class ClassName {
  constructor() { ... }
  method_1() { ... }
  method_2() { ... }
  method_3() { ... }
}

ການສ້າງການປະກອບປະເພດ "age" ທີ່ກັບຄືນອາຍຸລົດຂອງທ່ານ:

ອານຸພາສາ

class Car {
  constructor(name, year) {
    this.name = name;
    this.year = year;
  }
  age() {
    let date = new Date();
    return date.getFullYear() - this.year;
  }
}
let myCar = new Car("Ford", 2014);
document.getElementById("demo").innerHTML = "My car is " + myCar.age() + " years old.";

ການທົດລອງດ້ວຍຕົວຕົນ

ທ່ານສາມາດສົ່ງຄຳມາດເຂົ້າໃນການປະກອບປະເພດວິທະຍາສາດຢູ່ນັ້ນ:

ອານຸພາສາ

class Car {
  constructor(name, year) {
    this.name = name;
    this.year = year;
  }
  age(x) {
    return x - this.year;
  }
}
let date = new Date();
let year = date.getFullYear();
let myCar = new Car("Ford", 2014);
document.getElementById("demo").innerHTML = "My car is " + myCar.age(year) + " years old.";

ການທົດລອງດ້ວຍຕົວຕົນ

ການສະໜັບສະໜູນບັນດາບັນດາບາດບານ

ຕາຕະລາງລາຍລະອຽດລົງມາສະແດງການສະໜັບສະໜູນຂອງການສະແດງ JavaScript ຄອມມູນຄ່າທີ່ສະໜັບສະໜູນຢ່າງເຕັມສ່ວນ.

Chrome IE Firefox Safari Opera
Chrome 49 Edge 12 Firefox 45 Safari 9 Opera 36
ປີ 2016 ທີ 3 ປີ 2015 ທີ 7 ປີ 2016 ທີ 3 ປີ 2015 ທີ 10 ປີ 2016 ທີ 3

ໃນບົດປາກິດຂອງການສຶກສານີ້ເຫຼືອຈະມີຫລາຍຄວາມຮູ້ຂອງການຮັບຮູ້ JavaScript ຄອມມູນຄ່າ.