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
JavaScript3基礎——運算符和類型轉換
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.