Javascript運算符和數據類型如何轉換

本篇內容主要講解“Javascript運算符和數據類型如何轉換”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“Javascript運算符和數據類型如何轉換”吧!

一。if else 語句

if else用來表示中文里的 如果…， 就…， 否則……

// 條件為true, 執行if后面的括號代碼， 否則執行 else 后面括號代碼

if（條件） {

// todo

}else{

// todo

}

// 多重判斷

if（）{

} else if（） {

} else {

}

具體例子

<script>

   var a = 100;

   var b = 20;

   debugger;

   if （a > b） {

      console.log（'a 大于 b'）;

   } else {

      console.log（'a 小于 b'）;

   } 

</script>

<!-- 多重判斷 -->

<script>

   var gender = prompt（'請輸入性別'）;

   if （gender === '男'） {

      alert（'你是個男的'）;

   } else if（gender === '女'） {

      alert（'你是個妹子'）;

   } else {

      alert（'性別未知'）;

   }

</script>

二。類型轉換

【騰訊文檔】05-類型轉換-備課

問題： 以下代碼會打印什么

<script>

   var a = 'aa';

   var b = 'bb';

   if （a+b） {

      console.log（'xxxxxxx'）;

   } else {

      console.log（'yyyyyyyy'）;

   } 

</script>

1.顯式轉換

1.Number（變量名）將其他類型轉為數字//快捷方式  變量名*1

2.String（變量名）；轉字符串// 變量名+ &lsquo;&rsquo;

3.Boolean（變量名）；//!!變量名

<script>

    var str = '123';

    // 轉換為數字

    var num = Number（str）;

    console.log（num）;

    console.log（typeof num）;

    // 結果為NaN

    var str2 = 'abcd';

    var num2 = Number（str2）;

    console.log（num2）;

    //結果為0

    var str3 = '';

    var num3 = Number（str3）;

    console.log（num3）; 

 </script>

2.隱式轉換

<script>

   var a = 'aa';

   var b = 'bb';

    // a+b => aabb aabb會自動轉換為true, 所以執行結果為 xxxxxx

   if （a+b） {

      console.log（'xxxxxxx'）;

   } else {

      console.log（'yyyyyyyy'）;

   } 

</script>

3.數據類型轉換規則

【騰訊文檔】類型轉換規則 騰訊文檔

三。運算符

【騰訊文檔】js運算符思維導圖 騰訊文檔

1.算術運算

1.+-*/

2.相加的生活，有一個數為字符串，則+表示字符串拼接

<script>

    var a = 20;

    var b = 7;

    var num1 = a+b;

    var num2 = a-b;

    var num3 = a*b;

    var num4 = a/b;

    // 計算余數

    var num5 = a % b; 

    console.log（num1）;

    console.log（num2）;

    console.log（num3）;

    console.log（num4）;

    console.log（num5）; 

</script> 

<script>

  // 有一個數為字符串， 則+表示字符串拼接  

  var a = 100;

  var b = prompt（'請輸入數字'）;

  console.log（typeof b）;

  console.log（a+Number（b））;

</script>  

2.關系運算符（比較運算符）

var a = 10;

var b = '10';

console.log（a == b）; // true,類型不同， 先轉換成相同類型

console.log（a === b）; // false, 類型不同為false, 類型相同再判斷值是否相同

3.邏輯運算符

1.邏輯非！，取反即可

var boo1 = false;  // !boo1 => true  !!bool 

var num = 100; //  !num => false

var str = ''; //  !str => true

var obj = null; // !obj => true

var username; // !username => true

2.邏輯與&&：中文里并且的意思

        規律：前者為true取后者，否則取前者

        當都是布爾的時候，只有當倆者為true時結果為true，否則為false。

// 計算以下式子的值（參與運算的都是布爾類型）

true && true => true

true && false => false

false && true => false

false && false =>   false

// 計算以下式子的值（參與運算的是其他類型）

var num1 = 100;

var num2 = 0;

num1 && num2 => 0

num2 && num1 => 0

var a = 'web';

var b; 

a && c =>  // 報錯，計算的結果為c, 而c沒有聲明

b && c =>   undefined

3.邏輯或||:中文里的或者意思

        規律：前者為true取前者，否則取后者

        當都是布爾的生活，只要有一個為true，結果皆為true，否則為false。

<script>

console.log（true || true ）;  // true

console.log（true || false ）;  // true

console.log（false || true ）; // true

console.log（false || false ）; // false

 var num1 = 100;

var num2 = 0;

console.log（num1 || num2 ）;  // 100

console.log（num2 || num1 ）;  // 100

var a = 'web';

var b; 

console.log（a || c ）;  // web

console.log（b || c ）; // 報錯，計算的結果為c, 而c沒有聲明

</script>

4.一元計算符

i++，i先用原值運算，再自加1，后面要是有i它值為i+1；

++i，i先是給自己加1，再進行運算。

<!-- ++ 自加 -->

<script>

var i = 10;

var j = 20;

var i2 = 10 + i++;   // i先運算再自加1

console.log（'i2',i2）; // 20

console.log（'i',i）; // 11

var j2 = 10 + ++j; // j先自加1再運算

console.log（'j2',j2）; // 31

console.log（'j',j）;  // 21 

</script>

自減運算， 道理類似自加運算

<script>

var i = 10;

var j = 20;

var i2 = 10 + i--;   // i先運算在自減1

console.log（'i2',i2）; //  20

console.log（'i',i）; //  9

var j2 = 10 + --j; // j先自減1再運算

console.log（'j2',j2）; //  29

console.log（'j',j）;  //  19

</script>

練習：

<!-- 練習1 -->

<script>

var i = 10; 

var i2 = 10 + i++; // i=10 i2=20

var i3 = 10+ ++i; // i=12 i3=22

var i4 = 10 + i--; // i=11 i4=22   

var i5 = 10 + --i;  // i =10 i5=20   

// 求i,i2,i3,i4,i5的值

console.log（i,i2,i3,i4,i5）;

var count = 60; // 說出控制臺打印的值

console.log（--count）;  // 59

console.log（--count）;  // 58

console.log（--count）;//57

console.log（--count）;//56

console.log（--count）; //55

</script>

<!-- 練習2 -->    

<script>

var i = 1;

var j = 1;

var a = 10;

// 11   10+ 1

var b = a + i++;

//     11+  3   + 3   + 2

var c = b + ++i + i++ + ++j;

var d = a + b + c;

// i=4 j=2 a=10,b=11, c=19 d=40

console.log（i,j,a,b,c,d）; 

</script>   

5.復合賦值運算符

<script>

var a = 10;

a += 10;  

console.log（a）; // 20

a -= 10;

console.log（a）; // 10

a *= 10;

console.log（a）; // 100

a /= 10;

console.log（a）; // 10

a %= 10;

console.log（a）; // 0 

</script>

6.運算符優先級

（） > 自加（自減） > 算術 > 關系 > 邏輯 > 賦值

到此，相信大家對“Javascript運算符和數據類型如何轉換”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！