1.JS在瀏覽器中的運行方式
1.使用瀏覽器控制臺輸入代碼并執行
2.將JS腳本嵌入在HTML頁面中（重要）
（1）html元素事件中執行JS腳本
onclick事件：單擊元素時所做的操作
<button id="xxx" onclick="JS腳本"></button>
<button id="xxx" onclick="console.log('Hello World!')"></button>
（2）html頁面通過<script></script>撰寫腳本
（3）將JS腳本撰寫在外部腳本檔案中（js檔案）
<script type="text/javascript" src="https://www.cnblogs.com/hourglas/archive/2020/09/28/script.js"></script>
注意：外部引入時，<script></script>中不能寫任何東西
3.除錯JS
<script></script>陳述句一
<script></script>陳述句二
代碼一旦出現錯誤，會終止本陳述句塊的執行，但不影響其他陳述句塊的執行和決議
4.語法
console.log() 在控制臺輸出資料
document.write() 在網頁中輸出資料
window.prompt() 網頁帶有輸入的彈框
2.變數和常量
1.變數宣告、賦值
var 變數名 = 值；
當值為字串時，必須用 " " 或 ‘ ’ 括起來
2.變數名命名規范
（1）不允許使用JS關鍵字和保留關鍵字命名
（2）不能以數字開頭，只能包含字母、數字、下劃線 _ 、以及 $
3.常量宣告、賦值
const 常量名 = 值 ；
注意：常量一經宣告，就不允許修改資料
3.資料型別
1.基本型別
（1）number 型別 ：可以表示32位（4位元組）的整數，或64位（8位元組）的浮點數（小數）
（2）string 型別 字串型別
轉義字符：
\n： 換行
\r： 回車
\t： 制表符
\\： \
\'： '
\"： "
（3）boolean 型別 在程式中表示真偽
取值：
true ： 真
false ：假
注意：boolean型別可以參與到整數的四則運算中，其中 true = 1 ，false = 0
（4）undefined 宣告變數未賦值，訪問的物件的屬性不存在
（5）null 空
2.資料型別的轉換
（1）typeof(變數名) 查看當前變數的資料型別
JS中所有用戶手動輸入的資料，默認都是string型別
（2）toString() 轉化成字串，將任意型別的資料轉換成string 型別
var num = 15;
num.toString();
（3）parseInt(引數) 將引數轉化成整數，碰到第一個非數字的字符就停止轉換
var str = "123" ;
var num = parseInt(str) ;
（4）parseFloat(引數) 將引數轉換成浮點數，碰到第一個非數字的字符，則停止轉換
（5）Number(引數) 將引數轉化為number型別，只要包含非法字符，結果就是NaN
（6）變數.toFixed(保留位數) 將變數進行四舍五入并保留對應的位數
4.運算子
1. &&
條件1 && 條件2，如果條件1為 false 的話，就不用繼續判斷條件2，整個運算式的結果就為 false
條件 && 操作，如果條件為 true 的話，則執行后邊的操作，如果條件為 false ，則不執行后邊的操作
2. ||
條件1 || 條件2，如果條件1為 true ，則不用再執行條件2
條件 || 操作 ，當條件為 false 時，才會執行操作
練習：
從彈框中輸入一個數字表示工資，如果工資>=20000，提示“高工資”；如果工資在8000~20000之間，提示“中高工資”；如果工資<8000，則提示“普通工資”，
var input = window.prompt("請輸入你的工資："); input >= 20000 && console.log("高工資"); ( input >= 8000 && input <20000 ) && console.log("中高工資"); input < 8000 && input >= 0 ) && console.log("普通工資");
4.位運算子
1.作用：將數字轉換為二進制后進行運算，只做整數運算，如果是小數的話，則去掉小數位再運算，
2.位運算
（1）按位 與 ： &
語法：a & b
特點：將 a 和 b 先轉換為二進制，按位比較，對應位置的數字都為1的話，那么該位的整體結果為1，否則就為0
ex ： 5 & 3 5 : 101 3 : 001 ================= 001 結果： 1
使用場合：判斷奇偶性
任意數字與 1 做按位與操作，結果為1，則為奇數，否則為偶數
（2）按位 或 ： |
語法：a | b
特點：將 a 和 b 先轉換為二進制，按位比較，對應位置的數字有一位為1的話，那么該位的整體結果為1，否則為0
ex ： 5 | 3 5： 101 3： 011 ============= 111 結果 ： 7
使用場合：任何小數與0做按位或的操作，可以快速轉換為整數（并非四舍五入）
（3）按位 異或
語法：a ^ b
特點：將a和b先轉換為二進制，按位操作，對應位置上的兩個數字，相同時結果為0，不同為1
ex： 5 ^ 3 5: 101 3: 001 =========== 110 結果 ： 6
使用場合：快速交換兩個數字
var a = 5; var b = 3; a = a ^ b; b = b ^ a; a = a ^ b;
（4）賦值和擴展賦值運算子
賦值運算子 ： =
擴展賦值運算子 ： += ， -= ， *=
5.條件運算子（三目運算）
1.語法：條件？運算式1 : 運算式2
條件是一個boolean型別的資料，如果條件結果為true，則執行運算式1，如果條件結果為false，則執行運算式2
練習：
從彈框中錄入一個數字表示考試成績（score），如果成績為100分，提示 “滿分”；如果成績 >= 90 分，提示 “優” ；如果成績 >=80 分，提示良；如果成績 >=60 分，提示 “及格” ；否則提示 “不及格”
var score = window.prompt("請輸入你的成績：");
score == 100 ? console.log("滿分") :
(score >= 90? console.log("優"):
(score >= 80 ? console.log("良"):
(score >= 60 ? console.log("及格"):console.log("不及格"))));
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/142064.html
標籤：其他