這篇“JavaScript的嚴(yán)格模式怎么開啟”文章的知識點(diǎn)大部分人都不太理解，所以小編給大家總結(jié)了以下內(nèi)容，內(nèi)容詳細(xì)，步驟清晰，具有一定的借鑒價(jià)值，希望大家閱讀完這篇文章能有所收獲，下面我們一起來看看這篇“JavaScript的嚴(yán)格模式怎么開啟”文章吧。

目前創(chuàng)新互聯(lián)建站已為成百上千的企業(yè)提供了網(wǎng)站建設(shè)、域名、雅安服務(wù)器托管、網(wǎng)站托管、企業(yè)網(wǎng)站設(shè)計(jì)、奈曼網(wǎng)站維護(hù)等服務(wù)，公司將堅(jiān)持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長，共同發(fā)展。

1、嚴(yán)格模式

• JavaScript 除了提供正常模式外，還提供了嚴(yán)格模式

• ES5 的嚴(yán)格模式是采用具有限制性 JavaScript 變體的一種方式，即在嚴(yán)格的條件下運(yùn)行 JS 代碼

• 嚴(yán)格模式在IE10 以上版本的瀏覽器才會被支持，舊版本瀏覽器會被忽略

• 嚴(yán)格模式對正常的JavaScript語義做了一些更改：

• 消除了Javascript 語法的一些不合理、不嚴(yán)謹(jǐn)之處，減少了一些怪異行為

• 消除代碼運(yùn)行的一些不安全之處，保證代碼運(yùn)行的安全

• 提高編譯器效率，增加運(yùn)行速度

• 禁用了在 ECMAScript 的未來版本中可能會定義的一些語法，為未來新版本的 Javascript 做好鋪墊。比如一些保留字如：class, enum, export, extends, import, super 不能做變量名

1.1、開啟嚴(yán)格模式

• 嚴(yán)格模式可以應(yīng)用到整個(gè)腳本或個(gè)別函數(shù)中。

• 因此在使用時(shí)，我們可以將嚴(yán)格模式分為為腳本開啟嚴(yán)格模式和為函數(shù)開啟嚴(yán)格模式兩種情況

1.1.2、為腳本開啟嚴(yán)格模式

• 為整個(gè)腳本文件開啟嚴(yán)格模式，需要在所有語句之前放一個(gè)特定語句

• "use strict" 或'use strict'

因?yàn)?code>"use strict"加了引號，所以老版本的瀏覽器會把它當(dāng)作一行普通字符串而忽略。

有的 script 基本是嚴(yán)格模式，有的 script 腳本是正常模式，這樣不利于文件合并，所以可以將整個(gè)腳本文件放在一個(gè)立即執(zhí)行的匿名函數(shù)之中。這樣獨(dú)立創(chuàng)建一個(gè)作用域而不影響其他 script 腳本文件。

1.1.2、為函數(shù)開啟嚴(yán)格模式

• 若要給某個(gè)函數(shù)開啟嚴(yán)格模式，需要把"use strict"或'use strict'聲明放在函數(shù)體所有語句之前

• 將"use strict" 放在函數(shù)體的第一行，則整個(gè)函數(shù)以 "嚴(yán)格模式"運(yùn)行。

2、嚴(yán)格模式中的變化

• 嚴(yán)格模式對JavaScript的語法和行為，都做了一些改變

2.1、變量規(guī)定

• 在正常模式中，如果一個(gè)變量沒有聲明就賦值，默認(rèn)是全局變量

• 嚴(yán)格模式禁止這種用法，變量都必須先用var 命令聲明，然后再使用

• 嚴(yán)禁刪除已經(jīng)聲明變量，例如，``delete x` 語法是錯(cuò)誤的

2.2、嚴(yán)格模式下this指向問題

1. 以前在全局作用域函數(shù)中的this指向window對象

2. 嚴(yán)格模式下全局作用域中函數(shù)中的this 是undefined

3. 以前構(gòu)造函數(shù)時(shí)不加 new 也可以調(diào)用，當(dāng)普通函數(shù)，this指向全局對象

4. 嚴(yán)格模式下，如果構(gòu)造函數(shù)不加 new 調(diào)用，this指向的是 undefined ，如果給它賦值，會報(bào)錯(cuò)

5. new 實(shí)例化的構(gòu)造函數(shù)指向創(chuàng)建的對象實(shí)例

6. 定時(shí)器this 還是指向window

7. 事件、對象還是指向調(diào)用者

2.3、函數(shù)變化

1. 函數(shù)不能有重名的參數(shù)

2. 函數(shù)必須聲明在頂層，新版本的JavaScript會引入“塊級作用域”（ES6中已引入）。為了與新版本接軌，不允許在非函數(shù)的代碼塊內(nèi)聲明函數(shù)

3、高階函數(shù)

• 高階函數(shù)是對其他函數(shù)進(jìn)行操作的函數(shù)，它接收函數(shù)作為參數(shù)或將函數(shù)作為返回值輸出

接收函數(shù)作為參數(shù)

將函數(shù)作為返回值

• 此時(shí) fn 就是一個(gè)高階函數(shù)

• 函數(shù)也是一種數(shù)據(jù)類型，同樣可以作為參數(shù)，傳遞給另外一個(gè)參數(shù)使用。最典型的就是作為回調(diào)函數(shù)

• 同理函數(shù)也可以作為返回值傳遞回來

4、閉包

4.1、變量作用域

變量根據(jù)作用域的不同分為兩種：全局變量和局部變量

1. 函數(shù)內(nèi)部可以使用全局變量

2. 函數(shù)外部不可以使用局部變量

3. 當(dāng)函數(shù)執(zhí)行完畢，本作用域內(nèi)的局部變量會銷毀。

4.2、什么是閉包

閉包指有權(quán)訪問另一個(gè)函數(shù)作用域中的變量的函數(shù)

簡單理解：一個(gè)作用域可以訪問另外一個(gè)函數(shù)內(nèi)部的局部變量

4.3、在chrome中調(diào)試閉包

1. 打開瀏覽器，按 F12 鍵啟動 chrome 調(diào)試工具。

2. 設(shè)置斷點(diǎn)。

3. 找到 Scope 選項(xiàng)（Scope 作用域的意思）。

4. 當(dāng)我們重新刷新頁面，會進(jìn)入斷點(diǎn)調(diào)試，Scope 里面會有兩個(gè)參數(shù)（global 全局作用域、local 局部作用域）。

5. 當(dāng)執(zhí)行到 fn2() 時(shí)，Scope 里面會多一個(gè) Closure 參數(shù) ，這就表明產(chǎn)生了閉包。

4.4、閉包的作用

• 延伸變量的作用范圍

4.5、閉包練習(xí)

4.5.1、點(diǎn)擊li輸出索引號

    
        
榴蓮
        
臭豆腐
        
鯡魚罐頭
        
大豬蹄子
    
    

4.5.2、定時(shí)器中的閉包

    
        
榴蓮
        
臭豆腐
        
鯡魚罐頭
        
大豬蹄子
    
    

5、遞歸

如果一個(gè)函數(shù)在內(nèi)部可以調(diào)用其本身，那么這個(gè)函數(shù)就是遞歸函數(shù)

簡單理解： 函數(shù)內(nèi)部自己調(diào)用自己，這個(gè)函數(shù)就是遞歸函數(shù)

由于遞歸很容易發(fā)生"棧溢出"錯(cuò)誤，所以必須要加退出條件 return

6、淺拷貝和深拷貝

1. 淺拷貝只是拷貝一層，更深層次對象級別的只拷貝引用

2. 深拷貝拷貝多層，每一級別的數(shù)據(jù)都會拷貝

3. Object.assign(target,....sources) ES6新增方法可以淺拷貝

6.1、淺拷貝

// 淺拷貝只是拷貝一層，更深層次對象級別的只拷貝引用var obj = {
    id: 1,
    name: 'andy',
    msg: {
        age: 18
    }};var o = {}for(var k in obj){
    // k是屬性名，obj[k]是屬性值
    o[k] = obj.[k];}console.log(o);// 淺拷貝語法糖Object.assign(o,obj);

6.2、深拷貝

// 深拷貝拷貝多層，每一級別的數(shù)據(jù)都會拷貝var obj = {
    id: 1,
    name: 'andy',
    msg: {
        age: 18
    }
    color: ['pink','red']};var o = {};// 封裝函數(shù)function deepCopy(newobj,oldobj){
    for(var k in oldobj){
        // 判斷屬性值屬于簡單數(shù)據(jù)類型還是復(fù)雜數(shù)據(jù)類型
        // 1.獲取屬性值   oldobj[k]
        var item = obldobj[k];
        // 2.判斷這個(gè)值是否是數(shù)組
        if(item instanceof Array){
            newobj[k] = [];
            deepCopy(newobj[k],item)
        }else if (item instanceof Object){
              // 3.判斷這個(gè)值是否是對象
            newobj[k] = {};
            deepCopy(newobj[k],item)
        }else {
            // 4.屬于簡單數(shù)據(jù)類型
            newobj[k] = item;
            
        } 
    }}deepCopy(o,obj);

7、 正則表達(dá)式

正則表達(dá)式是用于匹配字符串中字符組合的模式。在JavaScript中，正則表達(dá)式也是對象。

正則表通常被用來檢索、替換那些符合某個(gè)模式（規(guī)則）的文本，例如驗(yàn)證表單：用戶名表單只能輸入英文字母、數(shù)字或者下劃線， 昵稱輸入框中可以輸入中文(匹配)。此外，正則表達(dá)式還常用于過濾掉頁面內(nèi)容中的一些敏感詞(替換)，或從字符串中獲取我們想要的特定部分(提取)等 。

7.1、特點(diǎn)

• 實(shí)際開發(fā)，一般都是直接復(fù)制寫好的正則表達(dá)式

• 但是要求會使用正則表達(dá)式并且根據(jù)自身實(shí)際情況修改正則表達(dá)式

7.2、創(chuàng)建正則表達(dá)式

在JavaScript中，可以通過兩種方式創(chuàng)建正則表達(dá)式

1. 通過調(diào)用 RegExp 對象的構(gòu)造函數(shù)創(chuàng)建

2. 通過字面量創(chuàng)建

7.2.1、通過調(diào)用 RegExp 對象的構(gòu)造函數(shù)創(chuàng)建

通過調(diào)用 RegExp 對象的構(gòu)造函數(shù)創(chuàng)建

var 變量名 = new RegExp(/表達(dá)式/);

7.2.2、通過字面量創(chuàng)建

通過字面量創(chuàng)建

var 變量名 = /表達(dá)式/;

注釋中間放表達(dá)式就是正則字面量

7.2.3、測試正則表達(dá)式 test

• test()正則對象方法，用于檢測字符串是否符合該規(guī)則，該對象會返回true或false,其參數(shù)是測試字符串

regexObj.test(str)

• regexObj 寫的是正則表達(dá)式

• str 我們要測試的文本

• 就是檢測str文本是否符合我們寫的正則表達(dá)式規(guī)范

示例

7.3、正則表達(dá)式中的特殊在字符

7.3.1、邊界符

正則表達(dá)式中的邊界符(位置符)用來提示字符所處的位置，主要有兩個(gè)字符

如果^ 和 $ 在一起，表示必須是精確匹配

// 邊界符 ^ $
var rg = /abc/;   //正則表達(dá)式里面不需要加引號，不管是數(shù)字型還是字符串型
// /abc/只要包含有abc這個(gè)字符串返回的都是true
console.log(rg.test('abc'));
console.log(rg.test('abcd'));
console.log(rg.test('aabcd'));

var reg = /^abc/;
console.log(reg.test('abc'));   //true
console.log(reg.test('abcd'));	// true
console.log(reg.test('aabcd')); // false

var reg1 = /^abc$/
// 以abc開頭，以abc結(jié)尾，必須是abc

7.3.2、字符類

• 字符類表示有一系列字符可供選擇，只要匹配其中一個(gè)就可以了

• 所有可供選擇的字符都放在方括號內(nèi)

①[] 方括號

/[abc]/.test('andy');     // true

后面的字符串只要包含 abc 中任意一個(gè)字符,都返回true

②[-]方括號內(nèi)部 范圍符

/^[a-z]$/.test()

方括號內(nèi)部加上-表示范圍，這里表示a - z26個(gè)英文字母都可以

③[^] 方括號內(nèi)部 取反符 ^

/[^abc]/.test('andy')   // false

方括號內(nèi)部加上^表示取反，只要包含方括號內(nèi)的字符，都返回 false

注意和邊界符 ^ 區(qū)別，邊界符寫到方括號外面

④字符組合

/[a-z1-9]/.test('andy')    // true

方括號內(nèi)部可以使用字符組合，這里表示包含a 到 z的26個(gè)英文字母和1到9的數(shù)字都可以

7.3.3、量詞符

量詞符用來設(shè)定某個(gè)模式出現(xiàn)的次數(shù)

7.3.4、用戶名驗(yàn)證

功能需求：

1. 如果用戶名輸入合法, 則后面提示信息為 : 用戶名合法,并且顏色為綠色

2. 如果用戶名輸入不合法, 則后面提示信息為: 用戶名不符合規(guī)范, 并且顏色為綠色

分析：

1. 用戶名只能為英文字母,數(shù)字,下劃線或者短橫線組成, 并且用戶名長度為 6~16位.

2. 首先準(zhǔn)備好這種正則表達(dá)式模式 /$[a-zA-Z0-9-_]{6,16}^/

3. 當(dāng)表單失去焦點(diǎn)就開始驗(yàn)證.

4. 如果符合正則規(guī)范, 則讓后面的span標(biāo)簽添加 right 類.

5. 如果不符合正則規(guī)范, 則讓后面的span標(biāo)簽添加 wrong 類.

     請輸入用戶名
    

7.4、括號總結(jié)

1. 大括號 量詞符 里面面表示重復(fù)次數(shù)

2. 中括號 字符集合 匹配方括號中的任意字符

3. 小括號 表示優(yōu)先級

// 中括號 字符集合 匹配方括號中的任意字符
var reg = /^[abc]$/;
// a || b || c
// 大括號 量詞符 里面表示重復(fù)次數(shù)
var reg = /^abc{3}$/;   // 它只是讓c 重復(fù)3次 abccc
// 小括號 表示優(yōu)先級
var reg = /^(abc){3}$/;  //它是讓 abc 重復(fù)3次

7.5、預(yù)定義類

預(yù)定義類指的是某些常見模式的簡寫寫法

7.5.1、表單驗(yàn)證

分析：

1.手機(jī)號碼: /^1[3|4|5|7|8][0-9]{9}$/

2.QQ: [1-9][0-9]{4,} (騰訊QQ號從10000開始)

3.昵稱是中文: ^[\u4e00-\u9fa5]{2,8}$

7.6、正則表達(dá)式中的替換

7.6.1、replace 替換

replace()方法可以實(shí)現(xiàn)替換字符串操作，用來替換的參數(shù)可以是一個(gè)字符串或是一個(gè)正則表達(dá)式

stringObject.replace(regexp/substr,replacement)

1. 第一個(gè)參數(shù): 被替換的字符串或者正則表達(dá)式

2. 第二個(gè)參數(shù)：替換為的字符串

3. 返回值是一個(gè)替換完畢的新字符串

// 替換 replacevar str = 'andy和red';var newStr = str.replace('andy','baby');var newStr = str.replace(/andy/,'baby');

7.6.2、正則表達(dá)式參數(shù)

/表達(dá)式/[switch]

switch按照什么樣的模式來匹配，有三種

• g: 全局匹配

• i:忽略大小寫

• gi: 全局匹配 + 忽略大小寫

以上就是關(guān)于“JavaScript的嚴(yán)格模式怎么開啟”這篇文章的內(nèi)容，相信大家都有了一定的了解，希望小編分享的內(nèi)容對大家有幫助，若想了解更多相關(guān)的知識內(nèi)容，請關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。