JS(第十一课)JS中的字符串你了解多少?

简介: JS(第十一课)JS中的字符串你了解多少?

1 创建String的对象 的语法是什么

  1. var  string对象名 = new 字符串名("用户创建的值")
  2. var newStr =new String("StringText")
  3. var newStr = new String("用户你好我是JavaScript中的字符串");
// 打印字符串的长度
var l = newStr.length;
console.log(typeof l)
// 打印字符串的长度
console.log("打印字符串的长度" + l)

上面的语法是打印字符串的长度

constructor

对创建该对象的函数的引用

// 创建字符串的对象
var newStr1 = new String("One World One Dream Dert")
// 判断
if (newStr1.constructor == String) {
    console.log("他是一个带有字符串的实现")
}
console.log(newStr1)
console.log(newStr1.constructor)

length

字符串的长度

prototype

允许您向对象添加属性和方法

// 定义字符串增加的方法
String.prototype.getl = function () {
    console.log(this.length)
}
var newStr2 = new String("abcdefghijklmnopq");
var l2 = newStr2
l2.getl()

String 对象属性的总结一:

属性

描述

constructor

对创建该对象的函数的引用

length

字符串的长度

prototype

允许您向对象添加属性和方法

2 String 对象的方法有哪些呢?

charAt()

返回在指定位置的字符。

创建下面的字符串

var aa = new String("付出才有回报。懂得付出,才能正确看待收获,ASDRT才能懂得平和自我。付出f越多收获才越大。唯有付出,才有收获。天下没有q免费的午餐,每个人都要摒弃不劳而获的想法,只有勤奋可以改变命运。");
//  查找字符
console.log("查找字符" + aa.charAt(8));

indexOf()

返回某个指定的字符串值在字符串中首次出现的位置。


//  查找首次的字符
console.log("查找首次出现的字符" + aa.indexOf("f"))

image.png

//  查找末尾的字符
console.log("查找最后出现的字符的位置" + aa.lastIndexOf("q"))

slice()

提取字符串的片断,并在新的字符串中返回被提取的部分。

//  截取字符串
console.log("截取字符串" + aa.slice(2))
console.log("截取某段字符串" + aa.slice(3, 9))

substr()

从起始索引号提取字符串中指定数目的字符。

// 指定位置去取字符串
console.log("substr截取字符串" + aa.substr(8))
console.log("substr截取某段字符串" + aa.substr(1, 9))

substring()

提取字符串中两个指定的索引号之间的字符。

// 字符的提取信息
console.log("字符的提取信息" + aa.substring(2))
console.log("字符的提取信息" + aa.substring(4, 9))

image.png

// 大小写转换
console.log("大小写转小换" + aa.toLocaleLowerCase())
console.log("大小写转大换" + aa.toUpperCase())

concat()

连接两个或更多字符串,并返回新的字符串。

// String对象的连接 和  分离
var nickname = new Array("东西", "星辰", "一律", "我的", "网站");
var lastname = new Array("南北", "大海", "放行", "世界", "设计");
// 如何将上面的信息进行拼接呢?
for (var i = 0; i < nickname.length; i++) {
    // 两串字符的拼接
    console.log(nickname[i].concat(lastname[i]));
}

split()

字符串分割为字符串数组。

//  字符串的分离
var str = "前途一片 光明,可我找不 到出路。感悟:把自 己封闭 起来,再光明 也是虚无。人到老年,放飞自己,才是真 正的出路。";
var str1 = "每个人都可以树立目标,但并不是每个人都能实现自己的目标。只要你付出劳动,总会得到目标的报偿。";
console.log(str.split(" "))
console.log(str.split("", 2))
console.log(str.split(" ", 3))

replace()

在字符串中查找匹配的子串, 并替换与正则表达式匹配的子串。

// 替换
var str = "Visit HangZhou";
console.log(str); //Visit HangZhou
console.log(str.replace(/Hang/g, "Su")); //Visit SuZhou
var str = "1 plus 2 equal 3";
console.log(str); //1 plus 2 equal 3
console.log(str.replace(/(\d)/g, "*"));  //* plus * equal *
var str = "as An angle";
console.log(str.replace(/a/, "b")); //bs An angle
console.log(str.replace(/a/g, "b")); //bs An bngle
console.log(str.replace(/a/gi, "b")); //bs bn angle
var str = "Karl,John";
console.log(str.replace(/(\w+)\s*,\s*(\w+)/, "$2,$1")); //John,Karl
var str = '"ab", "b"';
console.log(str.replace(/"([^"]*)"/g, "'$1'")); //'ab', 'b' 
var str = "aaa bbb ccc";
console.log(str.replace(/\b\w+\b/g, function (w) {
    return w.substring(0, 1).toUpperCase() + w.substring(1);
})); //Aaa Bbb Ccc 

search()

查找与正则表达式相匹配的值。

//search() – 执行一个正则表达式匹配查找。如果查找成功,返回字符串中匹配的索引值。否则返回 -1 。 
//stringObject.search(regexp) 返回stringObject 中第一个与 regexp 相匹配的子串的起始位置。
//此方法跟indexOf类似。此方法会忽略g标识
var str = "Visit HangZhou";
console.log(str) //Visit HangZhou
console.log(str.search(/Hang/)); //6
console.log(str.search(/hang/)); //-1
console.log(str.search(/hang/i)); //6
var str = "1 plus 2 equal 3";
console.log(str) //1 plus 2 equal 3
console.log(str.search(/\d/g)); //0

match()

查找找到一个或多个正则表达式的匹配。

// 从字符串中搜索出匹配regExp正则表达式的所有子字符串,将他们作为一个数组返回。利用对象类型到布尔类型的转换规则
// ,还可以判断一个字符串是否匹配regExp表示的正则表达式。
var strInput = prompt("请输入一个数字:", 0);
while (!strInput.match(/\d+/)) {
    strInput = prompt("请输入一个数字:", 0);
}

运行结果以代码的方式展示:

[Running] node "d:\Com.Src\JavaScript\Day10-20-1\js\String对象.js"
number
打印字符串的长度21
他是一个带有字符串的实现
[String: 'One World One Dream Dert']
[Function: String]
17
查找字符得
查找首次出现的字符37
查找最后出现的字符的位置60
截取字符串才有回报。懂得付出,才能正确看待收获,ASDRT才能懂得平和自我。付出f越多收获才越大。唯有付出,才有收获。天下没有q免费的午餐,每个人都要摒弃不劳而获的想法,只有勤奋可以改变命运。
截取某段字符串有回报。懂得
substr截取字符串得付出,才能正确看待收获,ASDRT才能懂得平和自我。付出f越多收获才越大。唯有付出,才有收获。天下没有q免费的午餐,每个人都要摒弃不劳而获的想法,只有勤奋可以改变命运。
substr截取某段字符串出才有回报。懂得付
字符的提取信息才有回报。懂得付出,才能正确看待收获,ASDRT才能懂得平和自我。付出f越多收获才越大。唯有付出,才有收获。天下没有q免费的午餐,每个人都要摒弃不劳而获的想法,只有勤奋可以改变命运。
字符的提取信息回报。懂得
大小写转小换付出才有回报。懂得付出,才能正确看待收获,asdrt才能懂得平和自我。付出f越多收获才越大。唯有付出,才有收获。天下没有q免费的午餐,每个人都要摒弃不劳而获的想法,只有勤奋可以改变命运。
大小写转大换付出才有回报。懂得付出,才能正确看待收获,ASDRT才能懂得平和自我。付出F越多收获才越大。唯有付出,才有收获。天下没有Q免费的午餐,每个人都要摒弃不劳而获的想法,只有勤奋可以改变命运。
东西南北
星辰大海
一律放行
我的世界
网站设计
[
  '前途一片',
  '光明,可我找不',
  '到出路。感悟:把自',
  '己封闭',
  '起来,再光明',
  '也是虚无。人到老年,放飞自己,才是真',
  '正的出路。'
]
[ '前', '途' ]
[ '前途一片', '光明,可我找不', '到出路。感悟:把自' ]
HelloExample
el
lloExample
mpl
elloExa
Visit HangZhou
Visit SuZhou
1 plus 2 equal 3
* plus * equal *
bs An angle
bs An bngle
bs bn bngle
John,Karl
'ab', 'b'
Aaa Bbb Ccc
Visit HangZhou
6
-1
6
1 plus 2 equal 3
0
[Done] exited with code=0 in 0.32 seconds

String 对象方法 总结二

image.png

image.png

3 格式化字符串有哪些 代码实操在下方

// 格式化字符串
var str="人最坏的习惯之一就是抱住已经拥有的东西不放,其实一个人只要舍得放下自己的那点小天地,就很容易走进宇宙的大世界。这个世界为你准备的精彩很多。"
document.write("<h2>"+str.anchor()+"</h2><br>")
document.write("<h2>"+str.big()+"</h2><br>")
document.write("<h2>"+str.small()+"</h2><br>")
document.write("<h2>"+str.fontsize()+"</h2><br>")
document.write("<h2>"+str.bold()+"</h2><br>")
document.write("<h2>"+str.italics()+"</h2><br>")
document.write("<h2>"+str.link()+"</h2><br>")
document.write("<h2>"+str.strike()+"</h2><br>")
document.write("<h2>"+str.blink()+"</h2><br>")
document.write("<h2>"+str.fixed()+"</h2><br>")
document.write("<h2>"+str.fontcolor("red")+"</h2><br>")
document.write("<h2>`其实一个人只要舍得放下自己的那点小天地'"+str.sub()+"</h2><br>")
document.write("<h2>`其实一个人只要舍得放下自己的那点小天地'"+str.sup()+"</h2><br>")

运行结果:

String HTML 格式化字符串 总结三

image.png

image.png

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title></title>
  </head>
  <style class="q">
    * {
      font-size: 43px;
    }
    .q {
      color: #C71585;
      font-size: 67px;
    }
  </style>
  <p class="q">String</p>
  <big>
    <script type="text/javascript" class="q" `>
      var myString = "this  ASlDFGHJK like love  sample too  no pains no gains my dreams afaith  "
      var a = myString.length;
      document.write(a);
      var b = myString.charAt(3);
      document.write(b);
      var c = myString.chaCoderAt(2);
      document.write(c);
      var d = myString.indexOf("too");
      document.write(d);
      var e = myString.lastIndexOf("s");
      document.write(e)
      var f = myString.substr(1, 7);
      document.write(f);
      var g = myString.substring(2, 23);
      document.write(g);
      var h = myString.split();
      document.write(a[5]);
      document.write(a);
      var i = myString.replace("too", "soort");
      document.write(i)
      var j = myString.toLowerCase();
      document.write(j);
      var k = myString.toUpperCase();
      document.write(k);
    </script>
  </big>
  <i>
    <script type="text/javascript">
      var myString = "this  ASlDFGHJK like love  sample too  no pains no gains my dreams afaith  "
      var j = myString.toLowerCase();
      document.write(j);
    </script>
  </i>
  <strike>
    <script type="text/javascript">
      var myString = "this  ASlDFGHJK like love  sample too  no pains no gains my dreams afaith  "
      var j = myString.toLowerCase();
      document.write(j);
    </script>
  </strike>
  <sub>
    <script type="text/javascript">
      var myString = "this  ASlDFGHJK like love  sample too  no pains no gains my dreams afaith  "
      var j = myString.toLowerCase();
      document.write(j);
    </script>
  </sub>
  <sup>
    <script type="text/javascript">
      var myString = "this  ASlDFGHJK like love  sample too  no pains no gains my dreams afaith  "
      var j = myString.toLowerCase();
      document.write(j);
    </script>
  </sup>
</html>

相关文章
|
2月前
|
JavaScript 前端开发
JS几种拼接字符串的方法
JS几种拼接字符串的方法
53 1
|
4月前
|
存储 JavaScript 前端开发
JS上传文件(base64字符串和二进制文件流)
这篇文章介绍了两种JavaScript文件上传的方法:使用FileReader对象将文件读取为base64字符串上传,以及使用FormData对象以二进制文件流的形式上传文件,包括如何处理文件选择、读取和上传的详细代码示例。
528 2
JS上传文件(base64字符串和二进制文件流)
|
3月前
|
JavaScript
js 解析 byte数组 成字符串
js 解析 byte数组 成字符串
91 5
|
1月前
|
JavaScript 前端开发 数据处理
模板字符串和普通字符串在浏览器和 Node.js 中的性能表现是否一致?
综上所述,模板字符串和普通字符串在浏览器和 Node.js 中的性能表现既有相似之处,也有不同之处。在实际应用中,需要根据具体的场景和性能需求来选择使用哪种字符串处理方式,以达到最佳的性能和开发效率。
|
1月前
|
JavaScript 前端开发 索引
JavaScript学习第二章--字符串
本文介绍了JavaScript中的字符串处理,包括普通字符串和模板字符串的使用方法及常见字符串操作方法如`charAt`、`concat`、`endsWith`等,适合前端学习者参考。作者是一位热爱前端技术的大一学生,专注于分享实用的编程技巧。
25 2
|
2月前
|
存储 JavaScript 前端开发
JavaScript 字符串(String) 对象
JavaScript 字符串(String) 对象
48 3
|
3月前
|
JavaScript 前端开发
javascript创建字符串
javascript创建字符串
|
3月前
|
JavaScript 前端开发
如何在JavaScript中替换字符串:一篇详细指南
如何在JavaScript中替换字符串:一篇详细指南
|
3月前
|
存储 JavaScript
js切割截取字符串方法
js切割截取字符串方法
61 2
|
3月前
|
Web App开发 JavaScript 前端开发
JavaScript 模板字符串
JavaScript 模板字符串
52 3