javascript基礎(chǔ)一

javascript基礎(chǔ)

javascript用法：

<script> 標(biāo)簽：

如需在 HTML 頁(yè)面中插入 JavaScript，請(qǐng)使用 <script> 標(biāo)簽。

  1. <script> 和 </script> 會(huì)告訴 JavaScript 在何處開(kāi)始和結(jié)束。
  2. <script> 和 </script> 之間的代碼行包含了 JavaScript。
<script>
    alert("我的第一個(gè) JavaScript");
</script>

瀏覽器會(huì)解釋并執(zhí)行位于 <script> 和 </script>之間的 JavaScript 代碼

注意：那些老舊的實(shí)例可能會(huì)在 <script> 標(biāo)簽中使用 type="text/javascript"?，F(xiàn)在已經(jīng)不必這樣做了。JavaScript 是所有現(xiàn)代瀏覽器以及 HTML5 中的默認(rèn)腳本語(yǔ)言。

javascript腳本所在位置：
<body> 中的 JavaScript：
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"> 
    <title>body標(biāo)簽?zāi)愕膉avascript</title> 
<body>
    <h1>我的 Web 頁(yè)面</h1>
    <p id="demo">一個(gè)段落</p>
    <button type="button" onclick="myFunction()">嘗試一下</button>

    <script>
        function myFunction()
        {
            document.getElementById("demo").innerHTML="我的第一個(gè) JavaScript 函數(shù)";
        }
    </script>

</body>
</head>
</html>
<head> 中的 JavaScript：
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"> 
    <title>head標(biāo)簽內(nèi)的javascript</title> 
    <script>
    function myFunction()
    {
        document.getElementById("demo").innerHTML="我的第一個(gè) JavaScript 函數(shù)";
    }
    </script>
</head>
<body>
    <h1>我的 Web 頁(yè)面</h1>
    <p id="demo">一個(gè)段落</p>
    <button type="button" onclick="myFunction()">嘗試一下</button>
</body>
</html>
外部的 JavaScript：

也可以把腳本保存到外部文件中。外部文件通常包含被多個(gè)網(wǎng)頁(yè)使用的代碼。（開(kāi)發(fā)中建議使用）

  1. 外部 JavaScript 文件的文件擴(kuò)展名是 .js。
  2. 如需使用外部文件，請(qǐng)?jiān)?<script> 標(biāo)簽的 "src" 屬性中設(shè)置該 .js 文件：
  3. 外部腳本不能包含 <script> 標(biāo)簽。
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"> 
    <title>外部javascript</title>
    <script src="myScript.js"></script>
<body>
</body>
</head>
</html>

JavaScript 輸出：

JavaScript 沒(méi)有任何打印或者輸出的函數(shù)。

JavaScript 可以通過(guò)不同的方式來(lái)輸出數(shù)據(jù)：

  1. 使用 window.alert() 彈出警告框。
  2. 使用 document.write() 方法將內(nèi)容寫(xiě)到 HTML 文檔中。
  3. 使用 innerHTML 寫(xiě)入到 HTML 元素。
  4. 使用 console.log() 寫(xiě)入到瀏覽器的控制臺(tái)。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>原生javascript</title>
</head>
<body>
    <p id="demo1">第一個(gè)段落</p>
    <button onclick="myFunction()">點(diǎn)擊</button>
    <script>
        // 彈出警告框
        alert("Hello Javascript");
        /*
         使用 document.write() 方法將內(nèi)容寫(xiě)到 HTML 文檔中。
         請(qǐng)使用 document.write() 僅僅向文檔輸出寫(xiě)內(nèi)容。
         如果在文檔已完成加載后執(zhí)行 document.write，整個(gè) HTML 頁(yè)面將被覆蓋。
        */
        document.write("Hello javascript");
        // 寫(xiě)在控制臺(tái)
        /*
        console.log() 方法能夠讓你看到你在頁(yè)面中的輸出內(nèi)容，讓你更容易調(diào)試javascript；
        與alert相比，console不會(huì)打斷你頁(yè)面的操作，console里面的內(nèi)容非常豐富，你可以在控制臺(tái)輸入 console。
        程序中調(diào)試是測(cè)試，查找及減少bug(錯(cuò)誤)的過(guò)程。
        */
        console.log("Hello Javascript");
        // 操作HTML元素
        document.getElementById('demo1').innerHTML="段落已修改";
        function myFunction(){
            document.getElementById('demo1').innerHTML="段落又已修改";
        }
    </script>
</body>
</html>

javascript注釋

JavaScript 不會(huì)執(zhí)行注釋。

我們可以添加注釋來(lái)對(duì) JavaScript 進(jìn)行解釋，或者提高代碼的可讀性。

  • 單行注釋以 // 開(kāi)頭。
  • 多行注釋以 /* 開(kāi)始，以 */ 結(jié)尾。

javascript變量：

變量是用于存儲(chǔ)信息的"容器"，您可以把變量看做存儲(chǔ)數(shù)據(jù)的容器。

變量命名規(guī)范：
  1. 變量必須以字母開(kāi)頭，后面有英文字母、數(shù)字、下劃線組成
  2. 變量也能以 $ 和 _ 符號(hào)開(kāi)頭（不過(guò)我們不推薦這么做）
  3. 變量名稱對(duì)大小寫(xiě)敏感（y 和 Y 是不同的變量）
  4. 使用駝峰命名法：第一個(gè)單詞首字母小寫(xiě)，其他首字母大寫(xiě)

JavaScript 語(yǔ)句和 JavaScript 變量都對(duì)大小寫(xiě)敏感。

  • 區(qū)分大小寫(xiě)：變量、函數(shù)名、運(yùn)算符以及其他一切東西都是區(qū)分大小寫(xiě)的。比如：變量test與變量TEST是不同的。
var a = 12;
var A = 12;//兩個(gè)變量不一樣

  • 駝峰命名：首字母是小寫(xiě)的，接下來(lái)的字母都以大寫(xiě)字符開(kāi)頭

    第一個(gè)字符必須是字母、下劃線（_）或美元符號(hào)（$）

    余下的字符可以是下劃線、美元符號(hào)或任何字母或數(shù)字字符

    var myTestValue = 0;

  • 不能有關(guān)鍵字與保留字：有特殊含義的叫關(guān)鍵字，未來(lái)有可能成為關(guān)鍵字的叫保留字

變量聲明：

在 JavaScript 中創(chuàng)建變量通常稱為"聲明"變量。

我們使用 var 關(guān)鍵詞來(lái)聲明變量并賦值。

var x = 15;   
var y = 16;
var z = x+y;
您可以在一條語(yǔ)句中聲明很多變量。該語(yǔ)句以 var 開(kāi)頭，并使用逗號(hào)分隔變量即可
var lastname="Doe", age=30, job="carpenter";
  • var （ES3）
  • function （ES3） 創(chuàng)建函數(shù)（函數(shù)名也是變量，只不過(guò)存儲(chǔ)的值是函數(shù)類型的而已）
  • let （ES6）與var相似
  • const （ES6）創(chuàng)建常量
  • import （ES6）基于es6的模塊規(guī)范導(dǎo)出需要的信息
  • class （ES6）基于es6創(chuàng)建類
/*
*語(yǔ)法：
*var [變量名] = 值;
*let [變量名] = 值;
*const [變量名] = 值;
*function 函數(shù)名(){}
*/
var a = 3;

function mySum(sum1,sum2){
  return sum1+sum2;
}

javascript數(shù)據(jù)類型：

基本數(shù)據(jù)類型
  • Number 數(shù)字
  • String 字符串
  • Null 空
  • Undefined 未定義
  • Boolean 布爾
[基本數(shù)據(jù)類型]
var n = 12；//NaN（not a number:不是一個(gè)數(shù)字，但是它是一個(gè)特殊的numer類型）

字符串
var a = '';

布爾
var c = true//只有兩個(gè)值  true 真與false 假

  1. 字符串（String）、

    字符串是存儲(chǔ)字符（比如 "Bill Gates"）的變量。

    字符串可以是引號(hào)中的任意文本。您可以使用單引號(hào)或雙引號(hào)

    規(guī)則:如果把數(shù)字與字符串相加，結(jié)果將成為字符串！

    var carname="Volvo XC60";
var carname='Volvo XC60';
x=5+5;  
y="5"+5; 
z="Hello"+5;
10 
55 
Hello5

2.數(shù)字(Number)、

3.布爾(Boolean)、

布爾（邏輯）只能有兩個(gè)值：true 或 false。

var x=true;
var y=false;
布爾常用在條件測(cè)試中

  1. 數(shù)組(Array)、

     var cars=new Array();
 cars[0]="Saab";
 cars[1]="Volvo";
 cars[2]="BMW";
或者
var cars=new Array("Saab","Volvo","BMW");
數(shù)組下標(biāo)是基于零的，所以第一個(gè)項(xiàng)目是 [0]，第二個(gè)是 [1]，以此類推。

  2. 對(duì)象(Object)、

    對(duì)象由花括號(hào)分隔。在括號(hào)內(nèi)部，對(duì)象的屬性以名稱和值對(duì)的形式 (key : value) 來(lái)定義。屬性由逗號(hào)分隔

    var person={firstname:"John", lastname:"Doe", id:5566};
或許
 var person={
 firstname : "John",
 lastname  : "Doe",
 id        :  5566
 };

  3. 空（Null）、

  4. 未定義（Undefined）。

JavaScript 擁有動(dòng)態(tài)類型。這意味著相同的變量可用作不同的類型：

var x;               // x 為 undefined
var x = 5;           // 現(xiàn)在 x 為數(shù)字
var x = "John";      // 現(xiàn)在 x 為字符串
引用數(shù)據(jù)類型
  • 對(duì)象object
    • 普通對(duì)象
    • 數(shù)組對(duì)象
    • 數(shù)學(xué)對(duì)象
    • 日期對(duì)象
    • ......
  • 函數(shù)function
[引用數(shù)據(jù)類型]
普通對(duì)象：
var o = {name:"丁會(huì)想",age:21}

數(shù)組對(duì)象：
var arr = [12,2,22]
ES6新加的數(shù)據(jù)類型：symbol

創(chuàng)建出來(lái)的是惟一的值

var a = Symbol("dinghuixiang");
var b = Symbol("dinghuixiang");
a==b;//false,a與b不相等
擴(kuò)展：js代碼如何運(yùn)行以及運(yùn)行后如何輸出結(jié)果

[如何被運(yùn)行]

  • 把代碼運(yùn)行在瀏覽器中（瀏覽器內(nèi)核來(lái)渲染解析）
  • 基于node來(lái)運(yùn)行（node也是一個(gè)基于v8引擎渲染與解析ja的工具）

[如何輸出結(jié)果]

  • alert：彈窗，基于alert輸出的結(jié)果都會(huì)轉(zhuǎn)化為字符串
  • console.log
  • console.dir
類型的詳解
  • number數(shù)字類型
    • NaN：not a number 但它是數(shù)字類型，NaN和誰(shuí)都不相等
    • isNaN：檢測(cè)當(dāng)前值是否不是有效數(shù)字，返回false代表是有效數(shù)字，返回true代表不是有效數(shù)字
var num = 12
isNaN(num)//false
isNaN('12')//false
isNaN('丁')//true
isNaN(true)//false
isNaN(false)//false
isNaN(null)//false
isNaN(undefined)//true
isNaN({age:2})//true
isNaN([12,230])//true
isNaN([12])//false
isNaN(function(){})//true

isNaN檢測(cè)機(jī)制：
1、驗(yàn)證當(dāng)前的需要檢測(cè)的值是否為數(shù)字類型，如果不是，瀏覽器會(huì)默認(rèn)的把值轉(zhuǎn)化為數(shù)字類型

    -其他類型轉(zhuǎn)數(shù)字：直接使用Number（）

    Number(true)//1
    Number(false)//0
    Number(null)//0
    Number(undefined)//NaN
    
    -把引用數(shù)據(jù)類型轉(zhuǎn)化為數(shù)字：先用toString轉(zhuǎn)化為字符串，在Number轉(zhuǎn)化為數(shù)字
    
    parseFloat()    解析一個(gè)字符串，并返回一個(gè)浮點(diǎn)數(shù)。
    parseInt()  解析一個(gè)字符串，并返回一個(gè)整數(shù)。
2、當(dāng)前檢測(cè)的值已經(jīng)是數(shù)字類型，是有效數(shù)字返回false，不是返回true
（數(shù)字類型中只有nan不是有效數(shù)字，其余都是）
  • 字符串
  • 布爾類型

只有兩個(gè)值：true/false

如何將其他數(shù)據(jù)轉(zhuǎn)換為布爾類型

  • Boolean
  • ！
  • !!
Boolean()
!'丁會(huì)想'//先把其他數(shù)據(jù)類型轉(zhuǎn)換為布爾類型，然后取反
!!'丁會(huì)想'//取兩次反，等價(jià)于沒(méi)取反（一般使用）
規(guī)律：`在js中只用0/NaN/null/undefined/空字符串，轉(zhuǎn)化為布爾為false，其余為true`
  • null與undefined

都代表空或沒(méi)有

  • null：空對(duì)象指針
  • undefined：未定義

null：在 JavaScript 中 null 表示 "什么都沒(méi)有"，是一個(gè)只有一個(gè)值的特殊類型，表示一個(gè)空對(duì)象引用

var person = null; // 值為 null(空), 但類型為對(duì)象
//是手動(dòng)控制的，于是后面會(huì)為其賦值

undefined:在 JavaScript 中 undefined 是一個(gè)沒(méi)有設(shè)置值的變量。

var person; // 值為 undefined(空), 類型是undefined  未定義
//
對(duì)象數(shù)據(jù)類型

普通對(duì)象

  • 有大括號(hào)包裹起來(lái)的
  • 由零個(gè)到多個(gè)屬性名與屬性值（鍵值對(duì)）組成

屬性是用來(lái)描述當(dāng)前對(duì)象的特征的

屬性為[key]

屬性名為[value]

var obj = {
  name:'dinghuixiang',
  age:21
}
//對(duì)象的操作

[獲取]
語(yǔ)法：對(duì)象.屬性名/對(duì)象[屬性名]
obj.name
obj['name'] :一般來(lái)說(shuō)屬性名是字符串格式的

[增/改]
在js對(duì)象（同一對(duì)象中）中屬性名是不可以重復(fù)的，是惟一的
obj.name = 'ding-mouren';//=>修改name屬性
obj.sex = '男';//增加sex屬性

[刪]
徹底刪除:對(duì)象不存在此屬性
delete obj['age'];

假刪除：并沒(méi)有刪除這個(gè)屬性，只是讓當(dāng)前屬性的值為空
obj.sex = null;

javascript函數(shù)

函數(shù)語(yǔ)法

函數(shù)就是包裹在花括號(hào)中的代碼塊，前面使用了關(guān)鍵詞 function：

function functionname()
 {
    執(zhí)行代碼
 }

JavaScript 對(duì)大小寫(xiě)敏感。關(guān)鍵詞 function 必須是小寫(xiě)的，并且必須以與函數(shù)名稱相同的大小寫(xiě)來(lái)調(diào)用函數(shù)。

function 中的花括號(hào)是必需的，即使函數(shù)體內(nèi)只包含一條語(yǔ)句，仍然必須使用花括號(hào)將其括起來(lái)。

函數(shù)定義

JavaScript 使用關(guān)鍵字 function 定義函數(shù)。

函數(shù)可以通過(guò)聲明定義，也可以是一個(gè)表達(dá)式。

  1. 函數(shù)聲明
<p>本例調(diào)用的函數(shù)會(huì)執(zhí)行一個(gè)計(jì)算，然后返回結(jié)果：</p>
<p id="demo"></p>
<script>
function myFunction(a,b){
    return a*b;
}
document.getElementById("demo").innerHTML=myFunction(4,3);
</script>

函數(shù)聲明后不會(huì)立即執(zhí)行，會(huì)在我們需要的時(shí)候調(diào)用到。

2.函數(shù)表達(dá)式

<p>函數(shù)存儲(chǔ)在變量后，變量可作為函數(shù)使用：</p>
<p id="demo"></p>
<script>
var x = function (a, b) {return a * b};
document.getElementById("demo").innerHTML = x(4, 3);
</script>

以上函數(shù)實(shí)際上是一個(gè) 匿名函數(shù) (函數(shù)沒(méi)有名稱)。

函數(shù)存儲(chǔ)在變量中，不需要函數(shù)名稱，通常通過(guò)變量名來(lái)調(diào)用。

上述函數(shù)以分號(hào)結(jié)尾，因?yàn)樗且粋€(gè)執(zhí)行語(yǔ)句。

3.Function() 構(gòu)造函數(shù)

<p>JavaScrip 內(nèi)置構(gòu)造函數(shù)。</p>
<p id="demo"></p>
<script>
var myFunction = new Function("a", "b", "return a * b");
document.getElementById("demo").innerHTML = myFunction(4, 3);
</script>

在 JavaScript 中，很多時(shí)候，你需要避免使用 new 關(guān)鍵字。

實(shí)際上，你不必使用構(gòu)造函數(shù)。上面實(shí)例可以寫(xiě)成

<p id="demo"></p>
<script>
var myFunction = function (a, b) {return a * b}
document.getElementById("demo").innerHTML = myFunction(4, 3);
</script>

javascript作用域

作用域是可訪問(wèn)變量的集合。

  1. 在JavaScript中，能夠定義全局作用域或者局部作用域。
  2. 在 JavaScript 中, 對(duì)象和函數(shù)同樣也是變量。
  3. 在 JavaScript 中, 作用域?yàn)榭稍L問(wèn)變量，對(duì)象，函數(shù)的集合。
  4. JavaScript 函數(shù)作用域: 作用域在函數(shù)內(nèi)修改。
javascript局部作用域

變量在函數(shù)內(nèi)聲明，變量為局部作用域。

局部變量：只能在函數(shù)內(nèi)部訪問(wèn)。

因?yàn)榫植孔兞恐蛔饔糜诤瘮?shù)內(nèi)，所以不同的函數(shù)可以使用相同名稱的變量。

局部變量在函數(shù)開(kāi)始執(zhí)行時(shí)創(chuàng)建，函數(shù)執(zhí)行完后局部變量會(huì)自動(dòng)銷毀

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>W3Cschool教程(w3cschool.cn)</title> 
</head>
<body>

<p>局部變量在聲明的函數(shù)內(nèi)可以訪問(wèn)。</p>
<p id="demo"></p>
<script>
myFunction();
document.getElementById("demo").innerHTML =
    "我可以顯示 " +  typeof carName;
function myFunction() 
{
    var carName = "Volvo";
}
</script>

</body>
</html>   
//
顯示
//

局部變量在聲明的函數(shù)內(nèi)可以訪問(wèn)。

我可以顯示 undefined
javascript全局作用域

變量在函數(shù)外定義，即為全局變量。

全局變量有 全局作用域: 網(wǎng)頁(yè)中所有腳本和函數(shù)均可使用。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>W3Cschool教程(w3cschool.cn)</title> 
</head>
<body>

<p>全局變量在任何腳本和函數(shù)內(nèi)均可訪問(wèn)。</p>
<p id="demo"></p>
<script>
var carName = "Volvo";
myFunction();
function myFunction() 
{
    document.getElementById("demo").innerHTML =
        "我可以顯示 " + carName;
}
</script>

</body>
</html>
//
顯示
//
全局變量在任何腳本和函數(shù)內(nèi)均可訪問(wèn)。

我可以顯示 Volvo
javascript作用域生命周期
  • JavaScript 變量生命周期在它聲明時(shí)初始化。
  • 局部變量在函數(shù)執(zhí)行完畢后銷毀。
  • 全局變量在頁(yè)面關(guān)閉后銷毀。
函數(shù)參數(shù)

函數(shù)參數(shù)只在函數(shù)內(nèi)起作用，是局部變量。

注意

你的全局變量，或者函數(shù)，可以覆蓋 window 對(duì)象的變量或者函數(shù)。
局部變量，包括 window 對(duì)象可以覆蓋全局變量和函數(shù)。

在 ES6 中，提供了 let 關(guān)鍵字和 const 關(guān)鍵字。

let 的聲明方式與 var 相同，用 let 來(lái)代替 var 來(lái)聲明變量，就可以把變量限制在當(dāng)前代碼塊中。

使用 const 聲明的是常量，其值一旦被設(shè)定便不可被更改。

javascript事件

事件是可以被 JavaScript 偵測(cè)到的行為。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>W3Cschool教程(w3cschool.cn)</title> 
</head>
<body>

<p>點(diǎn)擊按鈕執(zhí)行 <em>displayDate()</em> 函數(shù).</p>
<button onclick="displayDate()">點(diǎn)我</button>

<script>
function displayDate()
{
    document.getElementById("demo").innerHTML=Date();
}
</script>
<p id="demo"></p>

</body>
</html>

javascript字符串

JavaScript 字符串用于存儲(chǔ)和處理文本。

字符串屬性
屬性 描述
constructor 返回創(chuàng)建字符串屬性的函數(shù)
length 返回字符串的長(zhǎng)度
prototype 允許您向?qū)ο筇砑訉傩院头椒?/td>
字符串方法
Method 描述
charAt() 返回指定索引位置的字符
charCodeAt() 返回指定索引位置字符的 Unicode 值
concat() 連接兩個(gè)或多個(gè)字符串，返回連接后的字符串
fromCharCode() 將指定的 Unicode 值轉(zhuǎn)換為字符串
indexOf() 返回字符串中檢索指定字符第一次出現(xiàn)的位置
lastIndexOf() 返回字符串中檢索指定字符最后一次出現(xiàn)的位置
localeCompare() 用本地特定的順序來(lái)比較兩個(gè)字符串
match() 找到一個(gè)或多個(gè)正則表達(dá)式的匹配
replace() 替換與正則表達(dá)式匹配的子串
search() 檢索與正則表達(dá)式相匹配的值
slice() 提取字符串的片斷，并在新的字符串中返回被提取的部分
split() 把字符串分割為子字符串?dāng)?shù)組
substr() 從起始索引號(hào)提取字符串中指定數(shù)目的字符
substring() 提取字符串中兩個(gè)指定的索引號(hào)之間的字符
toLocaleLowerCase() 根據(jù)主機(jī)的語(yǔ)言環(huán)境把字符串轉(zhuǎn)換為小寫(xiě)，只有幾種語(yǔ)言（如土耳其語(yǔ)）具有地方特有的大小寫(xiě)映射
toLocaleUpperCase() 根據(jù)主機(jī)的語(yǔ)言環(huán)境把字符串轉(zhuǎn)換為大寫(xiě)，只有幾種語(yǔ)言（如土耳其語(yǔ)）具有地方特有的大小寫(xiě)映射
toLowerCase() 把字符串轉(zhuǎn)換為小寫(xiě)
toString() 返回字符串對(duì)象值
toUpperCase() 把字符串轉(zhuǎn)換為大寫(xiě)
trim() 移除字符串首尾空白
valueOf() 返回某個(gè)字符串對(duì)象的原始值

javascript高級(jí)

ES6

let與const命令

let命令

promise函數(shù)

介紹與基本使用

promise：異步編程的一種解決方案，更加優(yōu)雅的方式來(lái)進(jìn)行異步操作

//sync:同步

//async：異步

異步操作之后有三種狀態(tài)：

1、pending：等待

2、fulfill：滿足 主動(dòng)回調(diào)resolve函數(shù)時(shí)，就處于這種狀態(tài)，并會(huì)回調(diào).then（）函數(shù)

3、reject：拒絕 主動(dòng)回調(diào)reject函數(shù)時(shí)，就處于這種狀態(tài)，并會(huì)回調(diào).catch（）函數(shù)

基本語(yǔ)法

第一種：

//什么時(shí)候使用promise，一般是有異步操作時(shí)，使用promise對(duì)這個(gè)異步操作進(jìn)行封裝  
        //new -> 構(gòu)造函數(shù)(1、保存狀態(tài)信息，2、執(zhí)行傳入函數(shù))
        new Promise((resolve,reject) => {
            setTimeout(() => {
                //網(wǎng)絡(luò)請(qǐng)求成功
                // resolve("dinghuixiang")
                //網(wǎng)絡(luò)請(qǐng)求失敗
                reject("error message")
            },1000)
        }).then((data) => {//處理成功
            //處理代碼
            console.log(data);
        }).catch((err) => {//處理失敗
            console.log(err);
        })

第二種：

//什么時(shí)候使用promise，一般是有異步操作時(shí)，使用promise對(duì)這個(gè)異步操作進(jìn)行封裝  
            //new -> 構(gòu)造函數(shù)(1、保存狀態(tài)信息，2、執(zhí)行傳入函數(shù))
            new Promise((resolve,reject) => {
                setTimeout(() => {
                    //網(wǎng)絡(luò)請(qǐng)求成功
                    // resolve("dinghuixiang")
                    //網(wǎng)絡(luò)請(qǐng)求失敗
                    reject("error message")
                },1000)
            }).then((data) => {//處理成功
                //處理代碼
                console.log(data);
            },(err) => {//處理失敗
                console.log(err);
            })

實(shí)例以及簡(jiǎn)寫(xiě)：

        //網(wǎng)絡(luò)請(qǐng)求:aaa 
        //處理:bbb111
        //處理:bbb222
        new Promise((resolve,reject) => {
            setTimeout(() => {
                resolve("aaa")
            },1000)
        }).then(res => {
            console.log(res);
            return new Promise((resolve,reject) => {
                // resolve(res+"111");//成功
                reject("error message")//失敗
            })
        }).then(res => {
            console.log(res);
            return new Promise((resolve,reject) => {
                resolve(res+"222");
            })
        }).then(res => {
            console.log(res);
        }).catch(err => {
            console.log(err);
        })

//  new Promise((resolve,reject) => {
//      setTimeout(() => {
//          resolve("aaa")
//      },1000)
//  }).then(res => {
//      console.log(res);
//      return Promise.resolve(res+"111")
//  }).then(res => {
//      console.log(res);
//      return Promise.resolve(res+"222")
//  }).then(res => {
//      console.log(res);
//  })

//  new Promise((resolve,reject) => {
//      setTimeout(() => {
//          resolve("aaa")
//      },1000)
//  }).then(res => {
//      //自己處理代碼
//      console.log(res);
//      return (res+"111")
//  }).then(res => {
//      console.log(res+"第二層");
//      return (res+"222")
//  }).then(res => {
//      console.log(res+"第三次");
//  })
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書(shū)系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容