如何在JavaScript中使用结构体？

在本教程中，我们将讨论如何在JavaScript中使用结构体。

什么是结构体？结构体是数据结构的简称。结构体在一个变量中创建多个不同类型的值。我们可以使用结构体来生成记录。

JavaScript中的结构体就是对象的创建。除此之外，JavaScript没有结构体特性。

让我们看看创建结构体的方法。

使用String split()方法

让我们学习如何使用字符串分割来创建结构体。

用逗号和空格分隔字符串，并将其作为输入来创建所需结构的构造函数。现在我们可以访问此构造函数的对象。

用户可以按照以下语法来完成此操作。

语法

function createStruct(keys) {
   if (!keys) return null;
   const kArr = keys.split(', ');
   const kCount = kArr.length;
   function createConstructor() {
      for (let i = 0; i < kCount; i++)
         this[kArr[i]] = arguments[i];
   }
   return createConstructor;
}
const keyObj = new createStruct('key1, key2');
const valObj = new keyObj('val1, val2');
valObj.key1;

上述语法根据字符串输入创建构造函数。

属性

  • 键 - 键是输入字符串。

返回值

构造函数返回一个对象结构。

示例

下面的程序根据字符串输入创建了一个简单的对象和两个复杂的结构体对象。

第一个复杂的结构体对象包含一个数组，第二个复杂的结构体对象包含另一个对象。输出显示对象结构和对象结构的属性。

<html>
<body>
   <h2> Working with struct using<i> string split </i> </h2>
   <div id="structOneBtnWrap">
      <button id="structOneBtn"> Click Me </button>
   </div>
   <p id="structOneOut"></p>
   <script>
      var structOneOut = document.getElementById("structOneOut");
      var structOneBtnWrap = document.getElementById("structOneBtnWrap");
      var structOneBtn = document.getElementById("structOneBtn");
      var structOneInpStr = "";
      structOneBtn.onclick = function() {
         structOneInpStr = "";
         
         //structOneBtnWrap.style.display = "none";
         function createStruct(keys) {
            if (!keys)
               return null;
            const kArr = keys.split(', ');
            const kCount = kArr.length;

            function createConstructor() {
               for (let i = 0; i < kCount; i++)
                  this[kArr[i]] = arguments[i];
            }
            return createConstructor;
         }
         const user = new createStruct("id, name");
         const egan = new user(1, 'Egan');
         structOneInpStr += JSON.stringify(egan) + "<br><br>";
         structOneInpStr += "<b>name = </b>" + egan.name + "<br><br>";
         structOneInpStr += "<b>id = </b>" + egan.id + "<br><br><br><br>";
         const userMult = new createStruct("id, name, color");
         const colors = new userMult(1, 'Anna', ['Blue', 'Grey']);
         structOneInpStr += JSON.stringify(colors) + "<br><br>";
         structOneInpStr += "<b>color = </b>" + colors.color + "<br><br>";
         structOneInpStr += "<b>first color = </b>" + colors.color[0] + "<br><br>";
         structOneInpStr += "<b>second color = </b>" + colors.color[1] + "<br><br>";
         structOneInpStr += "<b>id = </b>" + colors.id + "<br><br>";
         structOneInpStr += "<b>name = </b>" + colors.name + "<br><br><br><br>";
         const userData = new createStruct('job, place');
         const moreData = new userData('Handicapper', 'USA');
         const userObj = new createStruct('id, name, info');
         const grace = new userObj(1, 'Grace', moreData);
         structOneInpStr += JSON.stringify(grace) + "<br><br>";
         structOneInpStr += "<b>name = </b>" + grace.name + "<br><br>";
         structOneInpStr += "<b>id = </b>" + grace.id + "<br><br>";
         structOneInpStr += "<b>job = </b>" + grace.info.job + "<br><br>";
         structOneInpStr += "<b>place = </b>" + grace.info.place + "<br><br>";
         structOneOut.innerHTML = structOneInpStr;
      };
   </script>
</body>
</html>

使用'this'关键字

让我们学习如何使用'this'关键字创建结构体。

用户可以按照以下语法来完成此操作。

语法

function createStruct(val1, val2){
   this.key1 = val1;
   this.key2 = val2;
}
var objArr = [
   new createStruct(‘val1', 'val2')
];

上述语法使用'this'关键字创建构造函数。

属性

  • val1, val2 - 值。

返回值

构造函数返回一个数组结构。

示例

下面的程序使用'this'关键字根据数组输入创建结构体。

<html>
<body>
   <h2> Working with struct using <i> 'this' </i> keyword reference function </h2>
   <div id="structFuncBtnWrap">
      <button id="structFuncBtn"> Click Me </button>
   </div>
   <p id="structFuncOut"></p>
   <script>
      var structFuncOut = document.getElementById("structFuncOut");
      var structFuncBtnWrap = document.getElementById("structFuncBtnWrap");
      var structFuncBtn = document.getElementById("structFuncBtn");
      var structFuncInpStr = "";
      structFuncBtn.onclick = function() {
         structFuncInpStr = "";
         
         //structFuncBtnWrap.style.display = "none";
         function createMovie(rating, review) {
            this.rating = rating;
            this.review = review;
            structFuncInpStr += "Rating = <b>" + this.rating + "</b><br><br>";
            structFuncInpStr += "Review = <b>" + this.review + "</b><br><br>";
         }
         var movieArr = [
            new createMovie('5', 'Great'),
            new createMovie('1', 'Poor')
         ];
         structFuncInpStr += "<b>Struct = </b><br><br>" + JSON.stringify(movieArr);
         structFuncOut.innerHTML = structFuncInpStr;
      };
   </script>
</body>
</html>

本教程教我们如何在JavaScript中使用结构体。结构体与JavaScript对象相同。第一种方法通过使用字符串分割来创建结构体，有点嵌套。第二种方法使用'this'关键字，实现起来比较简单。

更新于：2022年11月15日

7000+ 次浏览

启动你的职业生涯

完成课程获得认证

开始学习
广告