首頁 >web前端 >js教程 >淺析js中嚴格模式所需掌握的內容

淺析js中嚴格模式所需掌握的內容

不言
不言原創
2018-08-29 16:20:351320瀏覽

這篇文章帶給大家的內容是關於淺析js中嚴格模式所需掌握的內容,有一定的參考價值,有需要的朋友可以參考一下,希望對你有所幫助。

嚴格模式

首先來了解嚴格模式是什麼?
嚴格模式是JavaScript中的一種限制性更強的變種方式,不是一個子集:它在語義上與正常程式碼有明顯的差異,不支援嚴格模式的瀏覽器與支援嚴格模式的瀏覽器行為上也不一樣,所以不要在未經嚴格模式特性測試情況下使用嚴格模式,嚴格模式可以與非嚴格模式共存,所以腳本可以逐漸的選擇性加入嚴格模式

  • 嚴格模式的目的

首先,嚴格模式會將JavaScript陷阱直接變成明顯的錯誤,其次,嚴格模式修正了一些引擎難以優化的錯誤:同樣的程式碼有些時候嚴格模式會比非嚴格模式下更快,第三,嚴格模式禁用了一些有可能在未來版本中定義的語法

  • 全域開啟嚴格模式

#在JavaScript中想要開啟嚴格模式,需要在所有程式碼之前,定義一個不會賦給任何變數的字串:

'use strict';//或者"use strict"

如果之前的JavaScript是非嚴格模式的話,建議不要盲目為這段程式碼開啟嚴格模式,這樣可能會出現問題,建議按一個個函數去開啟嚴格模式
也可以為某個指定的函數開啟嚴格模式:

//函数外部依旧是非严格模式
function fun(){
    'user strict';//开启严格模式
}

在匿名函數中使用嚴格模式,相當於在全域開啟嚴格模式的變通實作方式

(function(){
    'use strict';//开启严格模式
})();
  • #禁止意外建立變數

在嚴格模式下,不允許意外建立全域變數
下例程式碼是非嚴格模式下意外建立全域變數

//未声明的变量
result='这是一个没用var声明的全局变量';

下例程式碼是嚴格模式下意外建立全域變數

'use strict';//开启严格模式
//严格模式下,意外创建全局变量,抛出ReferenceError
message='this is message';//ReferenceError: result is not defined
  • 靜​​默失敗轉為異常

靜默失敗就是既不報錯也沒有任何效果,例如改變常數的值,在嚴格模式下,靜默失敗會轉換成拋出異常,注意:這個分瀏覽器,有些瀏覽器會,有些不會
下例程式碼是非嚴格模式下的靜默失敗

const PI=3.14;
PI=1.14;//静默失败
console.log(PI);//3.14

下例程式碼是嚴格模式下的靜默失敗

'use strict';//开启严格模式

const PI=3.14;
PI=1.14;//抛出TypeError错误
  • 停用delete關鍵字

在嚴格模式下,無法對變數使用delete運算子
下例程式碼是非嚴格模式下使用delete運算符,結果會靜默失敗

var color='red';
delete color;

下例程式碼是嚴格模式下使用delete運算符,結果會拋出異常

'use strict';//开启严格模式

var color='red';
delete color;//SyntaxError: Delete of an unqualified identifier in strict mode.
  • 對變數名稱的限制

在嚴格模式下,JavaScript對變數名稱也有限制,特別不能使用implements,interface,let,packge,private,protected,public,stalic,yield這些內容作為變數名,它們都是保留字,在ECMAScript的下一個版本中可能會用到它們,在嚴格模式下,使用這些標識符作為變數名稱會導致語法錯誤

  • ##不可刪除的屬性

在嚴格模式下,無法使用delete運算子刪除不可刪除的屬性

下例程式碼是非嚴格模式下使用delete運算子刪除不可刪除的屬性,結果是靜默失敗

delete Object.prototype;
下例程式碼是嚴格模式下使用delete運算子刪除不可刪除的屬性,結果會拋出異常

'use strict';//开启严格模式
delete Object.prototype;//TypeError: Cannot delete property 'prototype' of function Object() { [native code] }
  • 屬性名稱必須唯一

在嚴格模式下,一個物件的所有屬性名在物件內必須唯一

下例程式碼是非嚴格模式下重名屬性是允許的,最後一個重名的屬性決定其屬性值

var o={p:1,p:2};
下例程式碼是嚴格模式下重名屬性被認為是語法錯誤

'use strict';//开启严格模式
var o={p:1,p:2};//不报错但是语法错误
  • 只讀屬性的賦值

  • ##在嚴格模式下,無法為一個唯讀的屬性重新賦值
下例程式碼是非嚴格模式為唯讀屬性重新賦值,結果會靜默失敗

var obj={};
Object.defineProperty(obj,'name',{
    value:'张三',
    writable:false
});//将属性设置为只读
obj.name='李四';

下例程式碼是嚴格模式下為唯讀屬性重新賦值,結果會拋出例外
'use strict';//开启严格模式
var obj={};
Object.defineProperty(obj,'name',{
    value:'张三',
    writable:false
});//将属性设置为只读
obj.name='李四';//TypeError: Cannot assign to read only property 'name' of object '#a87fdacec66f0909fc0757c19f2d2b1d'

    不可擴充的物件
  • 在嚴格模式下,不能為不可擴充的物件新增屬性
下例程式碼是非嚴格模式為不可擴充的物件新增屬性,結果會靜默失敗

var obj={};
Object.preventExtensinons(obj);//将对象设置为不可扩展
obj.name='张三';

下例程式碼是嚴格模式下不可擴充的物件新增屬性,結果會拋出異常
'use strict';//开启严格模式

var obj={};
Object.preventExtensions(obj);//将对象变得不可扩展
obj.name='张三';//TypeError: Cannot add property name, object is not extensible

    參數名稱必須唯一
  • 在嚴格模式下,要求命名函數的參數必須唯一
下範例程式碼是非嚴格模式下最後一個重名參數名稱會掩蓋先前的重名參數,先前的參數仍可透過arguments[i]來存取

function sum(a,a,c){}

下例程式碼是嚴格模式下重名參數被認為是語法錯誤
function sum(a,a,c){//语法错误
    'use strict';
    return a+a+c;//代码运行到这里会出错:SyntaxError: Duplicate parameter name not allowed in this context
}

    arguments的不同

在严格模式下,arguments对象的行为也有所不同
1.非严格模式下,修改命名参数的值也会反应到arguments对象中
2.严格模式下,命名参数与arguments对象是完全独立的

function fun(value){
    value='haha';
    console.log(value);//haha
    console.log(arguments[0]);//非严格模式下 hah
                              //严格模式下 hello
}

showValue('hello');
``

 - arguments.callee()
在严格模式下,不能使用arguments对象的callee()方法
下例代码是非严格模式下使用arguments对象的callee()方法,表示调用函数本身
var f=function(){
return arguments.callee;
};
f();
下例代码是严格模式下使用arguments对象的callee()方法,结果会抛出异常
'use strict';//开启严格模式
var f=function(){
return arguments.callee;
}
f();
/TypeError: 'caller', 'callee', and 'arguments' properties 
may not be accessed on strict mode functions or the arguments objects 
for calls to them/
 - 函数声明的限制
在严格模式下,只能在全局域和函数域中声明函数
下例代码非严格模式下在任何位置声明函数都是合法的
if(true){
function f(){}
}
下例是严格模式下在除全局域和函数域中声明函数是语法错误
'use strict';//开启严格模式
if(true){
function f(){}//语法错误,但是不报错
}
 - 增加eval作用域
在严格模式下,使用eval()函数创建的变量只能在eval()函数内部使用
下例代码是非严格模式下eval()函数创建的变量在其他位置可以使用
eval('var n=40');
console.log(n);//40
下例代码是严格模式下eval()函数创建的变量只能在eval()函数内部使用
'use strict';//开启严格模式
eval('var n=40');
console.log(n);//ReferenceError: n is not defined
 - 禁止读写
在严格模式下,禁止使用eval()和arguments作为标识符,也不允许读写它们的值
1.使用var声明
2.赋予另一个值
3.尝试修改包含的值
4.用作函数名
5.用作命名的函数的参数
6.在try...catch语句中用作例外名
在严格模式下,以下所有尝试将导致语法错误:
'use strict';//开启严格模式
eval=17;
arguments++;
++eval;
var obj={set p(arguments){}};
var eval;
try{}catch(arguments){}
function x(eval){}
function argunments(){}
var y=function eval(){}
var f=new Function('arguments','"use strict";return 20;');
 - 抑制this
在非严格模式下使用函数apply()或call()方法时,null或undefined值会被转换为全局对象
在严格模式下,函数的this值始终是指定的值(无论什么值)。
var color='red';
function sayColor(){
console.log(this.color);//非严格模式下 red
                    /*严格模式下:TypeError: Cannot 
                     read property 'color' of null*/
                     }

相关推荐:

JS设计模式之构造器模式详解

怎么使用JS严格模式

以上是淺析js中嚴格模式所需掌握的內容的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn