JavaScript3基础——运算符和类型转换
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript3基础——运算符和类型转换相关的知识，希望对你有一定的参考价值。
javascript3基础——运算符和类型转换
JavaScript运算符
JavaScript运算符也称操作符。其作用是对目标数据进行运算操作。
基本数学运算符
+ - * / % 分别为加，减，乘，除，求模（求余数）
加减乘除不再赘述，此处解释一下求模
eg： var a = 10%20 //10
eg： var a = 15%4 //3
求模运算较为常见的地方在于处理时间.
如下 199秒换算为几分几秒。
199/60 为分钟数 199%60 为秒数
eg： var s = 199;
alert(parseInt(s/60)+‘分‘+parseInt(s%60)+‘秒‘)//3分19秒
如果不加parseInt（）结果会存在因为除不尽无限小数的问题。该函数下面介绍。
求模还经常出现在有规律的变化问题上，比如隔行变色。
i%2 判断奇偶数，偶数设置一个背景色，奇数设置一个背景色。
eg:
<!DOCTYPE html>
<!--
作者：offline
时间：2017-05-23
描述：求模示例 隔行变色
-->
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
</style>
<script>
window.onload = function(){
var oLi = document.getElementsByTagName(‘li‘);
for(var i =0;i<oLi.length;i++){
if(i%2==0){//偶数
oLi[i].style.background=‘lightblue‘;
}else{
//
oLi[i].style.background=‘gray‘;
}
}
}
</script>
</head>
<body>
<ul id=‘ul‘>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</body>
</html>
赋值运算符
= += -= *= /= %=
对于我们最熟悉的就是=了，
eg ：var a = 1;
把数字1赋值给变量a;
而所谓的+=，-=，*=，/=，%= 其实都为两步运算，先运算再赋值。
eg ：var num = 5;
num+=3；
alert（num）//8
其等价于
var num = 5;
num = num + 3;
alert(num)//8;
故-=，*=，/=，%=依次类推。
值得一说的是
eg：var a +=5; 该句出现语法错误。
因为 拆分开为 var a = a+5，在运算时a还未定义。
自加和自减
++ -- 表示加1 或减1；
自加和自减本质一样，此处详细介绍自加。
var num = 10;
++num;
alert(num);//11
其等价于
var num =10;
num+=1;
alert(num);//11
等价于
var num =10;
num = num+1;
alert(num);//11
其最终结果都为11；
但是++num和num++是不一样的。也就是++的符号在变量前后意义是不一样的。
++num是先运算再赋值
num++是先赋值再运算。
eg: var num2 = 10;
var num3 = ++num2;
alert(num3); // 11
alert(num2); // 11
var num2 = 10;
var num3 = num2++;
alert(num3); // 10
alert(num2); // 11
比较运算符
== != < <= > >=
eg： var num1 = 5
var num2 = 10;
alert(num1==num2);//false
alert(num1<=num2);//true
………………
较为简单不再举例
逻辑运算符
大多数用在if语句的判断上，if语句只有为真才会执行，if（true）{执行内容}
&& || ！ 与或非
逻辑与&&表示AND代表并且
逻辑或||表示OR代表或者
逻辑非！代表NOT代表非
eg：
<script>
var a = true;
var b =false;
if(a&&b){
alert(‘&&‘);//a和b都为真才执行
}
if(a||b){
alert(‘||‘);//a和b有一个为真就执行
}
if(!b){
alert(‘！‘);//!b即！false 意思是不是false即true
}
</script>
三目运算符
三目运算符和日后学习的if条件语句较为相似。
表达式？true：false;
表达式为真则执行true部分，表达式为假则执行false部分
eg: var num1 = 1;
var num2 = num1<2 ? num1: 2;
意思是 num1是否小于2，如果小于2则把num1赋值给num2否则把2赋值给num2;
三目运算符还经常运来做兼容性处理。
var e = window.event ? window.event : e;//兼容chrome和IE
位运算符和位移运算符
% ^ | ~ >> << >>> 不常用制作了解即可
运算符优先级
先执行优先级高的运算符再执行低优先级运算符，
优先级相同则按照顺序有左到右执行
JavaScript类型转换
JavaScript类型转换分为三种。显示，隐式，强制。
显示类型转换
转换为字符串
toString()
转换为数字
parseInt()
parseFloat()
隐式类型转换
== ===
字符串加减
强制类型转换
Boolean(value)把给定的值转换为Boolean
Number(value)把给定的值转换为数字
String(value)把给定的值转换为字符串
eg: 转换为数字
var str = ‘123‘;
alert（parseInt（str））；//123
parseInt只能转换为能转换的数字。
var str = ‘123qwe‘;
alert（parseInt（str））；//123 ,qwe不再转换。
如果全部为不能转换的字符串则数显NAN
var str = ‘qwe‘;
alert(parseInt（str）)//NAN，表示非数字
eg: 转换为字符串
var num = 123;
alert(num.toString());//‘10‘
var boo = true;
alert(boo.toString());//‘true‘
eg：隐式类型转换
<script>
var a = 6;
var b = ‘6‘;
alert(a==b);// ==比较会先转换类型，然后比较 ，属于隐式类型转换；true
alert(a===b);//===不转换类型，直接比较,false
var num1 = ‘10‘;
var num2 =‘20‘;
var num3 = 30;
alert(num1+num2);//‘1020‘ +字符串连接
alert(num1+num3);//‘1030‘ 字符串和数字相加
alert(parseInt(num1)+num3);//40
alert(num1 - num2); //-10
</script>
限于文章篇幅原因，这里仅仅介绍冰山一角。由于笔者的水平有限，编写时间也很仓促，
文中难免会出现一些错误或者不准确的地方，不妥之处恳请读者批评指正
说在最后的话：
本博会开一个JS专栏，长期更新，由浅入深带大家系统的学习JavaScript，做出多彩的JS特效。
如果对你有用就关注一下吧。
想观看JS视频的博友可以在51CTO上搜索《多彩JavaScript》。
http://edu.51cto.com/course/10767.html
本文出自 “心有猛虎，细嗅蔷薇” 博客，请务必保留此出处http://zhangdongxu.blog.51cto.com/12029530/1956107
以上是关于JavaScript3基础——运算符和类型转换的主要内容，如果未能解决你的问题，请参考以下文章