原生JavaScript运算符与流程控制详解

作者:半夏

时间:2026-10-24

浏览:90

本文详细解析原生JavaScript中的核心运算符与流程控制机制。内容涵盖算术、赋值、关系及逻辑运算符的具体用法,并通过取模、隔行变色、时间转换等实例展示实际应用。同时深入讲解switch语句、break与continue的区别,以及JavaScript中真假值的判定规则,帮助开发者掌握基础语法。

文章目录

运算符

算术运算符包括:加号(+)、减号(-)、乘号(*)、除号(/)以及求模运算符(%)。

赋值运算符涵盖:等号(=)、加等于(+=)、减等于(-=)、乘等于(*=)、除等于(/=)以及求模等于(%=

关系:大于、小于、大于等于、小于等于、相等、全等、不等、不全等

逻辑:或、与、非

实例1、求模


window.onload = function(){
 alert(0%2) //0
 alert(1%2) //1
 alert(2%2) //0
}

实例2、隔行变色


<body>
 <ol>
  <li>取模:就是求余数</li>
  <li></li>
  <li></li>
 </ol>
 <script>
  window.onload = function(){
   var aLi = document.getElementsByTagName('li');
   for(var i = 0; i < aLi.length; i++){
    if(i % 2 == 0){
     aLi[i].style.background = 'red'
    }else{
     aLi[i].style.background = 'green'
    }
   }
  }
 </script>
</body>

实例3、秒转分钟


<script>
 window.onload = function () {
  var a = 1568
  console.log(parseInt(a / 60) + '分' + a % 60 + '秒')
 }
</script>

实例4、加等于


a = a + 1;
a+=1
a++

程序流程控制

switch


<script>
 window.onload = function () {
  var name = 'abc';
  var sex = ''
  switch (sex) {
   case '男':
    alert(name + '先生,你好');
    break;
   case '女':
    alert(name + '女士,你好');
    break;
   default:
    alert(name + '你好')
  }
 }
</script>

break、continue


window.onload = function(){
 for(var i = 0; i < 5; i++){
  if(i == 3){
   //break; //整个循环中断了
   continue; //本次循环中断了
  }
  alert(i)
 }
}

什么是真、什么是假


window.onload = function(){
 //真:true、非0数值、非空字符串('false'或‘ ')、非空对象
 //假: false、数值0、空字符串、空对象(null)、undefined
 var a = 'false'
 if(a){
  alert('真的')
 }else{
  alert('假的')
 }
}

总结

到此这篇关于原生js中运算符及流程控制的文章就介绍到这了,更多相关原生js运算符及流程控制内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站!

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章