12 JavaScript提升(2)

87 阅读1分钟

本文已参与「新人创作礼」活动,一起开启掘金创作之路。

一、JS循环

1.for循环
2.for in
3.while循环
4.do~while循环
具体使用方法如下所示:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>

<script>

  // 1.for循环:先判断再执行
  // 执行过程
  // 1)声明循环变量
  // 2)判断循环条件
  // 3)更新循环变量
  // 4)循环体
  for (var i = 0;i<10;i++){
      if (i==5){
          // break //满足条件,结束循环
          continue //跳过当次循环
      }
      console.log(i);

  }

2.while循环
  var x =0;
  while(x<5){
      document.write(x)
      x++
  }


  // 3.do/while循环:执行再判断:不管条件是否成立,先执行一次
  var p =11;//声明循环变量
  do{
      document.write(p)  //循环体
      p++ //更新循环变量
  }while (p<20) //判断循环条件

4.for in 循环
  // var arr = [1,4,5,7,0]
  var arr = {"name":"zhangsan","sex":"nan","age":18}
  for(var i in arr){ //var i 定义接收下标
      // 列表:打印所有接收到的下标
      //字典:输出键名
      console.log(i);

  }

</script>


</body>
</html>

二、字符串方法

1.length:长度
2.slice:切片
3.indexOf:索引
4.split:分割
5.substring/substr:截取
6.repalce:替换
具体使用方法如下所示:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<script>
  var str = "123453"
  
  //1.获取字符串长度
  console.log(str.length);
  
  //2.获取字符串下标
  console.log(str.indexOf("3"));
  
  //3.字符串替换:默认是替换一个
  console.log(str.replace("3", "**"));
  
  //4. 字符串全部替换:/g
  console.log(str.replace(/3/g, "**"));
  
  //5.字符串分割
  console.log(str.split("3"));
  
  //6.字符串切片:不能倒着切,但是可以取负数
  console.log(str.slice(1, 6));  //起始下标   结束下标(不包括)左闭右开
  console.log(str.slice(1, -1));  //起始下标   结束下标(不包括)
  
  //7.字符串截取:可以倒着切,不能取负数
  // 1)
  console.log(str.substring(1, 4));  //起始下标  结束下标 左闭右开
  console.log(str.substring(4, 1));  //起始下标  结束下标 左闭右开
// 切片 截取相同点:第一个参数都是起始下标,第二个参数都是结束下标 都遵循左闭右开原则
// 区别 切片:不能倒着切,但是可以取负数  截取:可以倒着切,不能取负数
  // 2)
  console.log(str.substr(1, 4)); //下标  长度

</script>

</body>
</html>

三、JS数组方法

1.length:长度
2.push:追加
3.unshift:添加
4.pop、shift:删除
5.indexOf:索引
6.slice、join、sort、reverse:改
具体使用方法如下所示:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<script>
  var arr = [6,7,8,0,3,2,1,1]
  // 1.获取数组长度
  console.log(arr.length);
  // 2.获取数组下标
  console.log(arr.indexOf(7));
  // 3.追加数组
  console.log(arr.push(4)); //打印数组长度 push是追加在后面
  console.log(arr);//原数组发生变化
  console.log(arr.unshift(9)); //打印数组长度 追加在前面
  console.log(arr);
  // 4.删除数组元素
  console.log(arr.pop()); //打印被删除的元素 删除最后一个
  console.log(arr);
  console.log(arr.shift()); //打印被删除的元素 删除第一个元素
  console.log(arr);
  // 5.数组切片:可以传负数
  console.log(arr.slice(0, -1)); //第一个参数起始下标  第二个参数结束下标(不包括)
  // 6.数组拼接:得到一个字符串
  console.log(arr.join("**"));
  // var str = arr.join("**")
  // console.log(typeof str);
  // 7.数组排序:会改变原数组
  console.log(arr);
  console.log(arr.sort()); //正序排序
  console.log(arr);//原数组经过排序之后,也改变了
  console.log(arr.reverse()); //反序排序
  console.log(arr);//原数组也会改变
</script>

</body>
</html>