字符串string

144 阅读1分钟

1.普通字符串

   <script>
      /* 1.字符串拼接 + 号*/
      /* 2.字符串重复  返回一个新的string     */
      console.log("y".repeat(5))

      /* 3. string 替换      */
      var str = "Visit Microsoft!"
      console.log(str.replace(/Microsoft/, "W3School"))

      /* 4. startsWith  endsWith      */
      let str = 'Hello ECMAScript 2015';
      let r1 = str.startsWith('Hello');
      console.log(r1); //是否以 Hello 开始  true
      let r2 = str.endsWith('2016');
      console.log(r2) //是否以 2016 结束    false

      /*  5. substr('截取的起始位置', '截取几个字符');      */
      var str1 = '改革春风吹满地';
      console.log(str1.substr(2, 2)); // 第一个2 是索引号的2 从第几个开始  第二个2 是取几个字符
      
   </script>

1.6. 字符转换为数组

split('分隔符')   join 把数组转换为字符串
 var str2 = 'red, pink, blue';
 console.log(str2.split(','));

2.模板字符串

	<script type="text/javascript">
		let name = `张三`;
		let sayHello = `Hello, 我的名字叫${name}`;
		console.log(sayHello);
		
		let result = {
			name: "zhangsan",
			age: 20
		};
		let html = `
			<div>
				<span>${result.name}</span>
				<span>${result.age}</span>
			</div>
		`;
		console.log(html);
		
		const fn = () => {
			return '我是fn函数'
		}

		let html = `我是模板字符串 ${fn()}`;
		console.log(html)

	</script>

3.trim 方法去除字符串两侧空格

<body>
   <input type="text"> <button>点击</button>
   <div></div>
   <script>
      // trim 方法去除字符串两侧空格
      var str = '   an  dy   ';
      console.log(str);
      var str1 = str.trim();
      console.log(str1);
      // 清除文本框左右两侧空格
      var input = document.querySelector('input');
      var btn = document.querySelector('button');
      var div = document.querySelector('div');
      btn.onclick = function() {
         var str = input.value.trim();
         if (str === '') {
            alert('请输入内容');
         } else {
            console.log(str);
            console.log(str.length);
            div.innerHTML = str;
         }
      }
   </script>
</body>