Computer >> Máy Tính >  >> Lập trình >> Javascript

Ký hiệu dấu chấm so với ký hiệu dấu ngoặc trong JavaScript

Cả ký hiệu dấu chấm và dấu ngoặc đều được sử dụng để truy cập các thuộc tính đối tượng trong JavaScript. Kí hiệu dấu chấm được sử dụng chủ yếu vì nó dễ đọc và dễ hiểu hơn và không dài dòng. Sự khác biệt chính giữa ký hiệu dấu chấm và ký hiệu dấu ngoặc là ký hiệu dấu ngoặc cho phép chúng ta truy cập các thuộc tính của đối tượng bằng cách sử dụng biến.

Sau đây là mã cho ký hiệu dấu ngoặc và ký hiệu dấu chấm trong JavaScript -

Ví dụ

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .result {
      font-size: 20px;
      font-weight: 500;
      color: blueviolet;
   }
</style>
</head>
<body>
<h1>Dot notation vs Bracket notation in JavaScript</h1>
<div class="result"></div>
<button class="Btn">CLICK HERE</button>
<h3>Click on the above button to access the student1 object properties using dot and bracket notation</h3>
<script>
   let resEle = document.querySelector(".result");
   let BtnEle = document.querySelector(".Btn");
   function Student(name, age, standard) {
      this.name = name;
      this.age = age;
      this.standard = standard;
   }
   let student1 = new Student("Rohan", 18, 12);
   BtnEle.addEventListener("click", () => {
      let str = "name",
      str1 = "age",
      str2 = "standard";
      resEle.innerHTML ="Using dot notation <br>student1.name = " + student1.name +       "<br>";
      resEle.innerHTML += "student1.age = " + student1.age + "<br>";
      resEle.innerHTML +=
      "student1.standard = " + student1.standard + "<br><br>";
      resEle.innerHTML +=" Using bracket notation <br>student1[str] = " +
      student1[str] +"<br>";
      resEle.innerHTML += "student1[str1] = " + student1[str1] + "<br>";
      resEle.innerHTML += "student1[str2] = " + student1[str2] + "<br>";
   });
</script>
</body>
</html>

Đầu ra

Ký hiệu dấu chấm so với ký hiệu dấu ngoặc trong JavaScript

Khi nhấp vào nút 'BẤM VÀO ĐÂY' -

Ký hiệu dấu chấm so với ký hiệu dấu ngoặc trong JavaScript