Rumah >hujung hadapan web >tutorial js >Sifat prototaip rentetan JavaScript

Sifat prototaip rentetan JavaScript

WBOYke hadapan: 2023-09-01 10:49:021037semak imbas

JavaScript 字符串原型属性

Dalam JavaScript, setiap objek mempunyai sifatnya sendiri dan setiap objek mengandungi atribut prototaip. Rentetan juga merupakan objek dalam JavaScript. Oleh itu, ia juga mengandungi sifat prototaip.

Sifat prototaip bersarang dalam objek, yang bermaksud setiap sifat prototaip mengandungi sifat prototaip yang lain. Sifat prototaip objek rentetan mengandungi kaedah dan sifat lalai. Walau bagaimanapun, pembangun boleh menyesuaikan sifat prototaip dan menambah kaedah dan sifat pada prototaip rentetan.

Dalam tutorial ini, kita akan belajar cara menggunakan sifat prototaip rentetan dan menyesuaikannya.

tatabahasa

Pengguna boleh menambah sebarang kaedah pada sifat prototaip rentetan dengan mengikut sintaks berikut.

String.prototype.method_name = function () {
   // function code
};

Dalam sintaks di atas, method_name hendaklah nama kaedah yang ingin kami tambahkan pada prototaip rentetan.

Contoh 1 (menggunakan kaedah toUpperCase() dan toLowerCase()

Dalam contoh di bawah, kami menggunakan kaedah toUpperCase() dan toLowerCase() bagi sifat prototaip rentetan untuk menukar rentetan kepada huruf besar dan huruf kecil masing-masing.

Dalam output, pengguna boleh memerhati rentetan yang terhasil.

<html>
<body>
   <h3> Using the <i> toUpperCase() and toLowerCase() </i> methods of string prototype property to customize the strings </h3>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById("output");
      var str = "Hello readers! This string contains uppercase and lowerCase letters.";
      var res = str.toUpperCase();
      var res1 = str.toLowerCase();
      output.innerHTML = "Original string: " + str + "<br>" + "Uppercase string: " + res + "<br>" + "Lowercase string: " +
      res1;
   </script>
</body>
</html>

Contoh 2 (menggunakan atribut Panjang)

Dalam contoh di bawah, kami menunjukkan cara menggunakan sifat lalai bagi sifat prototaip rentetan. Di sini kita menggunakan sifat "panjang" untuk mengira jumlah bilangan aksara dalam rentetan.

Dalam output, kita boleh melihat jumlah bilangan aksara atau panjang rentetan yang kita kira menggunakan sifat panjang.

<html>
<body>
   <h3> Using the <i> length </i> property of the string prototype property to get the length of the string </h3>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById("output");
      let string = "JavaScript string contains prototype property.";
      let len = string.length;;
      output.innerHTML = "The original string is: " + string + "<br><br>";
      output.innerHTML += "The length of the string is: " + len;
   </script>
</body>
</html>

Contoh 3 (Tambah kaedah pada prototaip rentetan)

Kami juga boleh menambah kaedah tersuai pada rentetan sifat prototaip. Di sini, kami telah menambah harta countWords() dalam prototaip rentetan, yang mengira jumlah bilangan perkataan dalam rentetan dan mengembalikan nilainya.

Di sini, kami membahagi rentetan menggunakan "" sebagai pembatas dan mengira panjang tatasusunan yang terhasil untuk mengira jumlah bilangan perkataan dalam rentetan. Dalam kod tersebut, kita dapat melihat bahawa kita boleh melaksanakan kaedah countWords() dengan mana-mana rentetan sebagai rujukan sama seperti kaedah rentetan lain.

<html>
<body>
   <h3> Adding the <i> countWords() method to the </i> string prototype property </h3>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById("output");
      // adding countWords() method to string prototype property.
      String.prototype.countWords = function () {
      return this.split(" ").length;
      };
      let string1 = "This is a string";
      let string2 = "Hey, do you know how many words are there in this string?";

      output.innerHTML = "The number of words in the string '" + string1 + "' is " + string1.countWords() + "<br>";
      output.innerHTML += "The number of words in the string '" + string2 + "' is " + string2.countWords();
   </script>
</body>
</html>

Contoh 4 (kaedah lalai prototaip rentetan tersuai)

Dalam contoh ini, kami menunjukkan cara untuk menyesuaikan kaedah lalai prototaip rentetan. Di sini, kami telah menyesuaikan kaedah toUpperCase(). Secara amnya, kaedah toUpperCase() mengembalikan rentetan selepas menukar semua aksara rentetan kepada huruf besar.

Kami telah menyesuaikannya untuk mengembalikan rentetan selepas menukar hanya aksara pertama kepada huruf besar. Di sini, kami akan mengembalikan rentetan yang sama jika aksara pertama sudah menjadi huruf besar. Jika tidak, kami menukar aksara pertama kepada huruf besar menggunakan nilai ASCII.

Dalam output, kita dapat melihat bahawa kaedah toUpperCase() hanya menukar aksara pertama rentetan kepada huruf besar dan bukannya keseluruhan rentetan.

<html>
<body>
   <h3> Customizing the <i> toUpperCase() method of the </i> string prototype property </h3>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById("output");
      
      //  Customizing the toUpperCase() method of the string prototype property to capitalize only the first character
      String.prototype.toUpperCase = function () {
         if (this.charCodeAt(0) >= 97 && this.charCodeAt(0) <= 122) {
         
            // convert to uppercase
            let ascii = this.charCodeAt(0) - 32;
            return String.fromCharCode(ascii) + this.slice(1);
         } else {
            return this;
         }
      }
      let str = "first letter of this string should be capitalized";
      output.innerHTML = "Original string: " + str + "<br>" + "Capitalized string: " + str.toUpperCase();
   </script>
</body>
</html>

Pengguna belajar menggunakan sifat prototaip rentetan. Kita boleh menggunakannya untuk menambah kaedah dan sifat pada objek rentetan. Selain itu, kami boleh menggunakannya untuk menyesuaikan sifat dan kaedah rentetan. Selepas menambah kaedah pada prototaip rentetan, kita boleh memanggil kaedah menggunakan rentetan sebagai rujukan.

Atas ialah kandungan terperinci Sifat prototaip rentetan JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：

Artikel ini dikembalikan pada:tutorialspoint.com. Jika ada pelanggaran, sila hubungi admin@php.cn Padam

Artikel sebelumnya：Panduan Terbaik untuk Membuat Akordion jQuery DiperibadikanArtikel seterusnya：Panduan Terbaik untuk Membuat Akordion jQuery Diperibadikan

Artikel berkaitan

Lihat lagi