一鍵部署DNS解析
阿新 • • 發佈：2021-01-08
技術標籤：前端開發學習筆記
1 Javascript概述
1. 1 概念
客戶端指令碼語言。
- 執行在客戶端瀏覽器中，每個瀏覽器都有Javascript的解析引擎
- 指令碼語言：不需要編譯，直接就可以被瀏覽器解析執行
1. 2 功能
- 可以增強使用者和html頁面的互動過程，可以來控制html元素，讓頁面有一些動態的效果，增強使用者體驗。
1. 3 發展歷史
- 1992年，Nombase公司，開發出第一門客戶端指令碼語言，專門用於表單的校驗。命名為 ： C-- ，後來更名為：ScriptEase
- 1995年，Netscape(網景)公司，開發了一門客戶端指令碼語言：LiveScript。後來，請來SUN公司的專家，修改LiveScript，命名為JavaScript
- 1996年，微軟抄襲JavaScript開發出JScript語言
- 1997年，ECMA(歐洲計算機制造商協會)，制定出客戶端指令碼語言的標準：ECMAScript，就是統一了所有客戶端指令碼語言的編碼方式。
JavaScript = ECMAScript + JavaScript自己特有的東西(BOM+DOM)
2 ECMAScript基礎語法
ECMAScript：客戶端指令碼語言的標準。
2.1 與html結合方式
- 內部JS
- 定義
<script>，標籤體內容就是js程式碼
- 定義
- 外部JS
- 定義
<script>，通過src屬性引入外部的js檔案
- 定義
- 注意
<script>可以定義在html頁面的任何地方。但是定義的位置會影響執行順序。<script>可以定義多個。
2.2 註釋
- 單行註釋：
//註釋內容 - 多行註釋：
/*註釋內容*/
2.3 資料型別
2.3.1 基本資料型別
- number： 數字型別
- 整數
- 小數
- NaN（Not A Number） 一個不是數字的數字型別
- string：字串。“abc”，“a”，‘ab’
- boolean：
true和false - null：一個物件為空的佔位符
- undefined：未定義。如果一個變數沒有給初始化值，則會被預設賦值為
undefined
2.3.2 引用資料型別
- object：物件
2.4 變數
變數：一段儲存資料的記憶體空間
-
Java語言是強型別語言，而Javascript是弱型別語言。
- 強型別：在開闢變數儲存空間時，定義了空間將來儲存的資料的資料型別。只能儲存固定型別的資料
- 弱型別：在開闢變數儲存空間時，不定義空間將來的儲存資料型別，可以存放任意型別的資料。
-
語法格式
var 變數名 = 初始化值;
typeof運算子：獲取變數的型別。
注意：
typeof(null)運算後得到的是object
2.5 運算子
2.5.1 一元運算子
只有一個運算數的運算子
++、--：自增、自減++、--在前，先自增（自減），再運算++、--在後，先運算，再自增（自減）
+、-：正負號
注意：在JS中，如果運算數不是運算子所要求的型別，那麼js引擎會自動的將運算數進行型別轉換
其它型別轉number
- string轉number：按照字面值轉換。如果字面值不是數字，則轉為
NaN（不是數字的數字） - boolean轉number：
true轉為1，false轉為0
2.5.2 算術運算子
+、-、*、/、%
2.5.3 賦值運算子
=、+=、-=、*=、/=、%=、…
2.5.4 比較運算子
>、<、>=、<=、==、===(全等於)
比較方式
- 型別相同：直接比較
字串：按照字典序比較。按位逐一比較，直到得出大小為止。
- 型別不同：先進行型別轉換，在比較
===：全等於。在比較之前，先判斷型別，如果型別不一樣，則直接返回false。
2.5.4 邏輯運算子
&&、||、!
其它型別轉boolean
- number：
0或NaN為假，其他為真 - string：除了空字串(
"")，其他都是true null、undefined：都是false- 物件：所有物件都為
true
2.5.5 三元運算子
- 語法格式：
條件表示式? 值1: 值2
判斷表示式的值，如果是true則取值1，如果是false則取值2；
- 示例程式碼
var a = 3;
var b = 4;
var c = a > b ? 1:0; //c的值為0
2.6 流程控制語句
if...else...switch- 在java中，switch語句可以接受的資料型別：
byte、int、short、char、列舉(1.5)、String(1.7) - 在JS中,switch語句可以接受任意的原始資料型別
- 在java中，switch語句可以接受的資料型別：
whiledo...whilefor
2.7 JS特殊語法
- 語句以
;結尾，如果一行只有一條語句則;可以省略 ，但不建議省略。 - 變數的定義使用
var關鍵字，也可以不使用- 使用
var定義： 定義的變數是區域性變數 - 不使用：定義的變數是全域性變數
- 使用
2.8 九九乘法表
- 示例程式碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>99乘法表</title>
<style>
td{
border: 1px solid;
}
</style>
<script>
document.write("<table align='center'>");
//1.完成基本的for迴圈巢狀，展示乘法表
for (var i = 1; i <= 9 ; i++) {
document.write("<tr>");
for (var j = 1; j <=i ; j++) {
document.write("<td>");
//輸出 1 * 1 = 1
document.write(i + " * " + j + " = " + ( i*j) +" ");
document.write("</td>");
}
/*//輸出換行
document.write("<br>");*/
document.write("</tr>");
}
//2.完成表格巢狀
document.write("</table>");
</script>
</head>
<body>
</body>
</html>
3 基本物件
3.1 Function
Function：函式（方法）物件
3.1.1 建立
//方式1，瞭解即可
var fun = new Function(形式引數列表,方法體);
//方式2，常用方式
function 方法名稱(形式引數列表){
方法體
}
//方式3
var 方法名 = function(形式引數列表){
方法體
}
3.1.2 屬性
length: 代表形式引數的個數
3.1.3 特點
- 方法定義時，形參的型別不用寫，返回值型別也不寫。
- 方法是一個物件，如果定義名稱相同的方法，會覆蓋。
- 在JS中，方法的呼叫只與方法的名稱有關，和引數列表無關。
- 方法宣告中有一個隱藏的內建物件（陣列），
arguments，封裝所有的實際引數。
3.1.4 呼叫
方法名稱(實際引數列表);
3.2 Array
Array：陣列物件
3.2.1 建立
var arr = new Array(元素列表);
var arr = new Array(預設長度);
var arr = [元素列表]; //常用方式
3.2.2 常用方法
| 方法 | 說明 |
|---|---|
| join(分隔符) | 將陣列中的元素按照指定的分隔符拼接為字串 |
| push(資料) | 向陣列的末尾新增一個或更多資料元素，並返回新的長度。 |
3.2.2 屬性
length: 代表陣列的長度
3.2.3 特點
- JS中，陣列元素的型別可變的。
- JS中，陣列長度可變的。
3.3 Date
Date：日期物件
3.3.1 建立
var date = new Date();
3.3.2 常用方法
| 方法 | 說明 |
|---|---|
| toLocaleString() | 返回當前date物件對應的時間本地字串格式 |
| getTime() | 獲取毫秒值。返回當前如期物件描述的時間到1970年1月1日零點的毫秒值差。 |
3.4 Math
Math：數學物件
Array：陣列物件
3.4.1 建立
Math物件不用建立，直接使用。
Math.方法名();
3.4.2 常用方法
| 方法 | 說明 |
|---|---|
| random() | 返回[0,1) 之間的隨機數。 含0不含1 |
| ceil(x) | 對x進行上舍入 |
| floor(x) | 對x進行下舍入 |
| round(x) | 把x進行四捨五入為最接近的整數 |
3.4.2 屬性
PI: 表示圓周率
3.5 RegExp
RegExp：正則表示式物件
3.5.1 正則表示式
正則表示式定義字串的組成規則。
- 單個字元:
[]，如： [a] [ab] [a-zA-Z0-9_] - 特殊符號代表特殊含義的單個字元:
\d：單個數字字元 [0-9]\w：單個單詞字元[a-zA-Z0-9_]
- 量詞符號：
?：表示出現0次或1次*：表示出現0次或多次+：出現1次或多次{m,n}：表示 m ≤ 數 量 ≤ n m\le 數量 \le n m≤數量≤n- m如果預設， 例如
{,n}，表示最多n次 - n如果預設，例如
{m,}，表示最少m次
- m如果預設， 例如
- 開始結束符號
^：開始$：結束
3.5.2 正則物件
- 建立：
//方式1
var reg = new RegExp("正則表示式");
//方式2，常用方式
var reg = /正則表示式/;
- 方法
| 方法 | 說明 |
|---|---|
| test(字串) | 驗證指定的字串是否符合正則定義的規範 |
- 示例程式碼
var s1 = "yogeek1_cn";
var s2 = "yogeek1.cn";
var reg1 = /^\w{5,10}$/; //長度5-10、只包含數字、字母和下劃線的字串
//var reg2 = new RegExp("^\\w{5,10}$"); //規則與reg1相同
document.write(reg1.test(s1) + "<br>"); //true
document.write(reg1.test(s2) + "<br>");//false
3.6 Global
Global：全域性物件。這個Global中封裝的方法不需要物件就可以直接呼叫。
方法名();
3.6.1 方法
| 方法 | 說明 |
|---|---|
| encodeURI(url) | 將指定url編碼並返回結果 |
| decodeURI(str) | 將指定的str解碼 |
| encodeURIComponent(url) | 將指定url編碼並返回結果，編碼的字元更多 |
| decodeURIComponent(str) | 將指定的str解碼 |
| parseInt(str) | 將字串轉為數字 |
| isNaN(v) | 判斷一個值是否是NaN |
| eval(str) | 將字串作為指令碼程式碼來執行 |
注意
parseInt(str)：逐一判斷每一個字元是否是數字，直到不是數字為止，將前邊數字部分轉為number。如果無法轉換返回NaN。
var s1 = "123abc";
var s2 = "abc123";
document.write(parseInt(s1) + "<br>"); //123
document.write(parseInt(s2) + "<br>"); //NaN
NaN六親不認，連自己都不認。NaN參與的==比較全部為false，要判斷是否為NaN，只能用isNaN(v)。