极客笔记JavaScript 字符串原型属性
在JavaScript中，每个对象都有自己的属性，并且每个对象都包含原型属性。字符串也是JavaScript中的一个对象。因此，它也包含原型属性。
原型属性嵌套在对象中，意味着每个原型属性都包含另一个原型属性。字符串对象的原型属性包含默认的方法和属性。然而，开发人员可以自定义原型属性，并向字符串原型添加方法和属性。
在本教程中，我们将学习如何使用字符串原型的方法并进行自定义。
语法
用户可以按照以下语法向字符串原型属性添加任何方法。
String.prototype.method_name = function () {
// function code
};
在上述语法中，method_name 应该是我们想要添加到字符串原型的方法的名称。
示例 1（使用 toUpperCase() 和 toLowerCase() 方法）
在下面的示例中，我们使用了字符串原型属性的 toUpperCase() 和 toLowerCase() 方法，分别将字符串转换为大写和小写。
在输出中，用户可以观察到结果字符串。
<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>
示例2（使用length属性）
在下面的示例中，我们演示了如何使用字符串原型属性的默认属性。在这里，我们使用了’length’属性来计算字符串中的字符总数。
在输出中，我们可以看到字符串的总字符数或长度，这是通过使用length属性计算得出的。
<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>
示例3（向String原型添加方法）
我们还可以向string原型属性添加自定义方法。在这里，我们向字符串原型添加了countWords()属性，它计算字符串中单词的总数并返回其值。
在代码中，我们使用“ ”作为分隔符拆分字符串，并通过计算结果数组的长度来计算字符串中单词的总数。我们可以看到，我们可以通过将任何字符串作为引用来执行countWords()方法，就像其他字符串方法一样。
<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>
示例4（自定义字符串原型的默认方法）
在这个示例中，我们展示了如何自定义字符串原型的默认方法。在这里，我们自定义了toUpperCase()方法。通常，toUpperCase()方法将所有的字符串字符转换为大写后返回字符串。
我们将其定制为仅将字符串的第一个字符转换为大写后返回。这里，如果第一个字符已经是大写，我们将返回相同的字符串。否则，我们使用ASCII值将第一个字符转换为大写。
在输出中，我们可以看到toUpperCase()方法仅将字符串的第一个字符转换为大写，而不是将整个字符串转换为大写。
<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>
用户学会了使用字符串原型属性。我们可以使用它来向字符串对象添加方法和属性。此外，我们还可以使用它来自定义字符串属性和方法。在将方法添加到字符串原型之后，我们可以通过将字符串作为引用来调用该方法。