说说JavaScript的严格模式

CMAScript 5中引入了严格模式（strict mode），相同的代码在严格模型下有时会比普通模式下执行的更快。在严格模式下，执行引擎会对JavaScript进行更加严格的语法检查，一些在普通模式下的静默错误会在严格模式下抛出异常。

1. 使用严格模式

在语义上严格模式与普通模式并不完全一致，其主要表现在以下几个方面：

严格模式会将普通模式下的静默错误直接变成明显的错误
严格模式修改了一些执行引擎难以处理的错误，同样的代码在严格模式有时会比非严格模式下执行的更快
严格模式禁用了一些可能在未来版本中定义的语法

使用严格模式时应该保证执行环境支持严格模型，并对相关代码进行充分测试。严格模式可以与非严格模式共存，所以可以选择性对代码加入严格模式。

启用严格模型，只要在代码中加入"use strict";或'use strict';即可。我们可以为整个script标签或一个.js文件全部开启严格模式，也可以为某一个函数单独开启严格模式。

1.1 全部开启严格模式

在一个script标签或一个.js文件的顶部加入"use strict";或'use strict';，整个标签或文件就会运行在严格模式下：

1.2 部分使用严格模式

严格模式与非严格模式的模式的代码并不能合并使用，这时我们可以将使用严格式的代码封装到一个函数中，并对这个函数开启严格模式。对函数使用严格模式，同样在顶部加入"use strict";或'use strict';即可：

2. 与非严格模式的区别

JavaScript会对错误进行静默处理，有时候会给本来错误操作进行不报错处理，这可能会解决当前问题，但可能会给程序留下一些隐患。严格模式对JavaScript进行了非严格的语法检查，原本不报错的一些操作在严格模式下会抛出错误。

2.1 语法差异

启严格模式('use strict')后，在下面情况下会抛出SyntaxError异常。

不能删除已声明的变量

当使用delete删除已声明的变量时，会抛出SyntaxError错误：

禁用with语句

with语句会导致执行引擎无法进行优化，所以执行速度也会变慢。严格模式禁用with语句，使用时会抛出SyntaxError错误：

对象属性与函数参数名的唯一

在普通模式中，在对象中使用重复的属性名时，只有最后一个属性会起作用。但在严格模式中，会抛出SyntaxError异常：

在普通模式中，重复的函数参数名与重复的对象属性名处理方式类似，后面的参数会覆盖前面的同名参数。但在严格模式中，会抛出SyntaxError异常：

不能使用eval或arguments作为变量名或函数名

eval是JavaScript中的一个全局对象；arguments表示JavaScript的函数参数对象。在普通模式中eval和arguments都可作为变量名或函数名，但在严格模式中会抛出SyntaxError异常：

不能ECMAScript预留关键字

严格模式对可能在ECMAScript 6中或未来版本的语言规范中使用的关键字，如：implements、interface、let、package、private、protected、public、static、yield。使用这些关键字作为变量名或函数名，严格模式可能会抛出SyntaxError异常：

不能使用八进制

在ECMAScript规范中并没有关于八进制语法的定义，但以0开头的八进制语法确得到了浏览器的广泛支持，如：0644===420、"5"==="%"。但在严格模式中使用八进制语法可能会抛出SyntaxError异常：

禁止块级的函数声明

严格模式下，只能脚本级别或函数级别声名函数。

“不能ECMAScript预留关键字”及“禁止块级的函数声明”为未来版本的ECMAScript可能会引入的新语法提供了保护，扫除了语言未来发展中的一些障碍。

2.2 运行时差异

JavaScript在某些上下文情况下会对失败做静默处理，但在严格模式中同样情况下会抛出错误。

不能使用未定义的变量

普通模式下，JavaScript会对未赋值的错误使用全局变量，而在严格模式下将抛出ReferenceError异常：

更严格的对象属性操作

普通模式下，对不合法的对象属性操作会进行静默失败处理。如：对只读属性赋值、给不可写属性赋值、给不可扩展对象添加属性、删除不可删除的属性时，操作不会成功但也不没有任何错误提示。在严格模式中，这些操作都会抛出TypeError异常：

禁用部分Arguments或Function对象属性

严格模式下，使用以下Arguments对象的：arguments.callee和arguments.caller属性或使用Function对象的anyFunction.caller和anyFunction.arguments属性时，会产生TypeError异常。

2.3 语义差别

严格模式与普通模式有一些微小的语义差别，了解这些差异可以帮我们写出严格模式更加健壮的代码。

函数中的this

在普通函数中this总会被封将成一个对象，而在严格模式中this不在被封装成对象。如果没有指定其值，那么它的值是'undefined'：

eval的区别

在实际应用中并不推荐使用eval，在严格模式中也不例外。当需要使用eval时应该注意，严格模式中eval不会在当前的作用域内创建新的变量，eval中传入的字符串也会按严格模式进行解析。

参数值不随arguments的变化而变化

正常模式下，函数的参数(形参)值会随arguments对象的变化而变化，反之亦然。而在严格模式下，传递中函数中的值是形参值的拷贝，所以其值不会随arguments的变化而变化。

来自－ http://itbilu.com

者：前端进阶者来源：前端进阶学习交流

大家好，我是前端进阶者。

执行JavaScript代码时，可能会发生意想不到的错误。错误可以是程序员编写的编码错误，由于输入错误引起的错误以及其他不可预见的事情。

因此，为了处理错误，JavaScript提供了4个关键字。

一、JavaScript try ... catch语句

try语句允许定义一个代码块，该代码块在执行时将进行错误测试，catch如果try块中发生错误，则该语句允许您定义要执行的代码块。

JavaScript语句try和catch成对出现。

try {
//try_statements-尝试尝试的语句
}catch（err）{
//catch_statements-处理错误的语句
}

完整代码：

例中，将“alert”写为“aaalert”来故意产生错误。

<!DOCTYPE html>
<html>
<title>项目</title>

<body style="background-color: aqua;">
<h1>JavaScript Error</h1>

<p>将" alert"写为" aaalert"来故意产生错误：</p>

<p id="result"></p>
<script>
try {
aaalert("Hello world");
} catch (e) {
document.getElementById("result").innerHTML=e.name + "<br>" + e.message;
}
</script>

</body>
</html>

将" alert"写为" aaalert"来故意产生错误：

发生错误时，JavaScript通常会停止运行，并创建一个具有两个属性的Error对象：name和message。

二、JavaScript throw语句

throw语句引发用户定义的异常。

throw语句允许您创建自定义错误。从技术上讲，这称为“引发异常 ”。异常可以是JavaScript字符串，数字，布尔值或对象。

throw "Invalid"; // 生成带有字符串值的异常
throw 32; // 生成值为32的异常
throw true; // 生成值为true的异常

如果throw与try和一起使用catch，则可以指定程序流程并生成自定义错误消息。

在例中，如果传递任何非数字参数，则getRectArea()将引发自定义错误：

<script>
function getRectArea(width, height) {
if (isNaN(width) || isNaN(height)) {
throw "参数不是数字!";
}
}

try {
getRectArea(5, 'Z');
}
catch(err) {
document.getElementById('para').innerHTML=err;
}
</script>

1. 输入验证

如果值错误，则引发异常(err)。catch语句捕获异常(err)，并显示自定义错误消息。

var x=document.querySelector("input").value;
try {
if(x=="") throw "is Empty";
if(isNaN(x)) throw "Not a Number";
if(x > 10) throw "too High";
if(x < 5)throw "too Low";
}
catch(err) {
document.getElementById("para").innerHTML="Input " + err;
}

三、JavaScript 错误对象

JavaScript具有一个内置的Error对象，该对象在发生错误时提供错误信息。

四、错误类型

1. EvalError

当通过eval()函数执行代码期间发生错误时，将抛出一个EvalError。但是，JavaScript不再抛出此错误，但是仍然保留此对象是为了向后兼容。

较新版本的JavaScript不会抛出异常EvalError，使用SyntaxError代替。

2. RangeError

当使用超出允许值范围的数字时，将引发RangeError。

例如，创建长度为负数的数组将抛出RangeError。

try {
var arr=new Array(-1); // throws a range error
} catch(err) {
document.getElementById("result").innerHTML=err.name + "<br>" + err.message;
}

3. ReferenceError

试图引用或访问一个不存在的变量或对象时，通常会抛出一个ReferenceError。

try {
var x=5 + y; // 抛出引用错误
} catch(err) {
document.getElementById("result").innerHTML=err.name + "<br>" + err.message;
}

4. SyntaxError

如果您的JavaScript代码中有任何语法问题，则会在运行时引发SyntaxError。

try {
eval("alert('Hello)"); // Missing ' will throw an error
} catch(err) {
document.getElementById("result").innerHTML=err.name + "<br>" + err.message;
}

5. TypeError

当值不是期望的类型时，抛出TypeError。

var num=50;
try {
num.toUpperCase(); // 您不能将数字转换为大写
} catch(err) {
document.getElementById("result").innerHTML=err.name + "<br>" + err.message;
}

6. URIError

当指定无效的URI(统一资源标识符)时，将引发URIError。

<script>
try {
decodeURI("%"); // 你不能URI解码百分比符号
} catch (err) {
document.getElementById("result").innerHTML=err.name + "<br>" + err.message;
}
</script>

五、总结

本文基于JavaScript ，介绍了常见的错误处理。对于每一种错误语句都做了详细的分析，对于JavaScript 错误对象中需要注意的点。在实际操作中，遇到的难点提供了相对于的解决方法。希望能够帮助读者在遇到错误时更好的调试，处理。

代码很简单，希望能够帮助你更好的学习。

SON 教程

JSON: JavaScript Object Notation(JavaScript 对象表示法)

JSON 是存储和交换文本信息的语法。类似 XML。

JSON 比 XML 更小、更快，更易解析。

JSON 实例

{"sites": [{"name":"h5混合开发" , "url":"www.dongyibiancheng.com"}, {"name":"google" , "url":"www.google.com"}, {"name":"微博" , "url":"www.weibo.com"}]}

这个 sites 对象是包含 3 个站点记录（对象）的数组。

什么是 JSON ？

JSON 指的是 JavaScript 对象表示法（JavaScript Object Notation）
JSON 是轻量级的文本数据交换格式
JSON 独立于语言：JSON 使用 Javascript语法来描述数据对象，但是 JSON 仍然独立于语言和平台。JSON 解析器和 JSON 库支持许多不同的编程语言。目前非常多的动态（PHP，JSP，.NET）编程语言都支持JSON。
JSON 具有自我描述性，更易理解

JSON - 转换为 JavaScript 对象

JSON 文本格式在语法上与创建 JavaScript 对象的代码相同。

由于这种相似性，无需解析器，JavaScript 程序能够使用内建的 eval() 函数，用 JSON 数据来生成原生的 JavaScript 对象。

JSON 简介

JSON - 简介

在线实例

通过我们的编辑器，您可以在线编辑 JavaScript 代码，然后通过点击一个按钮来查看结果：

JSON 实例

<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>h5混合开发(www.xxxx.com)</title></head><body><h2>JavaScript 创建 JSON 对象</h2><p>网站名称: <spanid="jname"></span><br/> 网站地址: <spanid="jurl"></span><br/> 网站 slogan: <spanid="jslogan"></span><br/></p><script>

varJSONObject={"name":"h5混合开发", "url":"www.xxx.com", "slogan":"学的不仅是技术，更是梦想！"};document.getElementById("jname").innerHTML=JSONObject.namedocument.getElementById("jurl").innerHTML=JSONObject.urldocument.getElementById("jslogan").innerHTML=JSONObject.slogan

</script></body></html>

尝试一下 ?

点击 "尝试一下" 按钮查看在线实例。

与 XML 相同之处

JSON 是纯文本
JSON 具有"自我描述性"（人类可读）
JSON 具有层级结构（值中存在值）
JSON 可通过 JavaScript 进行解析
JSON 数据可使用 AJAX 进行传输

与 XML 不同之处

没有结束标签
更短
读写的速度更快
能够使用内建的 JavaScript eval() 方法进行解析
使用数组
不使用保留字

为什么使用 JSON？

对于 AJAX 应用程序来说，JSON 比 XML 更快更易使用：

使用 XML

读取 XML 文档
使用 XML DOM 来循环遍历文档
读取值并存储在变量中

使用 JSON

读取 JSON 字符串
用 eval() 处理 JSON 字符串

JSON 语法

JSON 语法是 JavaScript 语法的子集。

JSON 语法规则

JSON 语法是 JavaScript 对象表示法语法的子集。

数据在名称/值对中
数据由逗号分隔
大括号保存对象
中括号保存数组

JSON 名称/值对

JSON 数据的书写格式是：名称/值对。

名称/值对包括字段名称（在双引号中），后面写一个冒号，然后是值：

"name" : "h5混合开发"

这很容易理解，等价于这条 JavaScript 语句：

name="h5混合开发"

JSON 值

JSON 值可以是：

数字（整数或浮点数）
字符串（在双引号中）
逻辑值（true 或 false）
数组（在中括号中）
对象（在大括号中）
null

JSON 数字

JSON 数字可以是整型或者浮点型：

{"age":30}

JSON 对象

JSON 对象在大括号（{}）中书写：

对象可以包含多个名称/值对：

{"name":"h5混合开发" , "url":"www.xxxx.com"}

这一点也容易理解，与这条 JavaScript 语句等价：

name="h5混合开发"url="www.xxxx.com"

JSON 数组

JSON 数组在中括号中书写：

数组可包含多个对象：

{"sites": [{"name":"h5混合开发" , "url":"www.xxx.com"}, {"name":"google" , "url":"www.google.com"}, {"name":"微博" , "url":"www.weibo.com"}]}

在上面的例子中，对象 "sites" 是包含三个对象的数组。每个对象代表一条关于某个网站（name、url）的记录。

JSON 布尔值

JSON 布尔值可以是 true 或者 false：

{"flag":true}

JSON null

JSON 可以设置 null 值：

{"runoob":null}

JSON 使用 JavaScript 语法

因为 JSON 使用 JavaScript 语法，所以无需额外的软件就能处理 JavaScript 中的 JSON。

通过 JavaScript，您可以创建一个对象数组，并像这样进行赋值：

实例

varsites=[{"name":"runoob" , "url":"www.xxxx.com"}, {"name":"google" , "url":"www.google.com"}, {"name":"微博" , "url":"www.weibo.com"}];

可以像这样访问 JavaScript 对象数组中的第一项（索引从 0 开始）：

sites[0].name;

返回的内容是：

runoob

可以像这样修改数据：

sites[0].name="h5混合开发";

尝试一下 ?

在下面的章节，您将学到如何把 JSON 文本转换为 JavaScript 对象。

JSON 文件

JSON 文件的文件类型是 ".json"
JSON 文本的 MIME 类型是 "application/json"

JSON 对象

对象语法

实例

{"name":"runoob", "alexa":10000, "site":null}

JSON 对象使用在大括号({})中书写。

对象可以包含多个 key/value（键/值）对。

key 必须是字符串，value 可以是合法的 JSON 数据类型（字符串, 数字, 对象, 数组, 布尔值或 null）。

key 和 value 中使用冒号(:)分割。

每个 key/value 对使用逗号(,)分割。

访问对象值

你可以使用点号（.）来访问对象的值：

实例

varmyObj, x;myObj={"name":"runoob", "alexa":10000, "site":null};x=myObj.name;

尝试一下 ?

你也可以使用中括号（[]）来访问对象的值：

实例

varmyObj, x;myObj={"name":"runoob", "alexa":10000, "site":null};x=myObj["name"];

尝试一下 ?

循环对象

你可以使用 for-in 来循环对象的属性：

实例

varmyObj={"name":"runoob", "alexa":10000, "site":null};for(xinmyObj){document.getElementById("demo").innerHTML +=x + "<br>";}

尝试一下 ?

在 for-in 循环对象的属性时，使用中括号（[]）来访问属性的值：

实例

varmyObj={"name":"runoob", "alexa":10000, "site":null};for(xinmyObj){document.getElementById("demo").innerHTML +=myObj[x] + "<br>";}

尝试一下 ?

嵌套 JSON 对象

JSON 对象中可以包含另外一个 JSON 对象：

实例

myObj={"name":"runoob", "alexa":10000, "sites": {"site1":"www.xxxx.com", "site2":"m.runoob.com", "site3":"c.runoob.com"}}

你可以使用点号(.)或者中括号([])来访问嵌套的 JSON 对象。

实例

x=myObj.sites.site1;// 或者x=myObj.sites["site1"];

尝试一下 ?

修改值

你可以使用点号(.)来修改 JSON 对象的值：

实例

myObj.sites.site1="www.google.com";

尝试一下 ?

你可以使用中括号([])来修改 JSON 对象的值：

实例

myObj.sites["site1"]="www.google.com";

尝试一下 ?

删除对象属性

我们可以使用 delete 关键字来删除 JSON 对象的属性：

实例

deletemyObj.sites.site1;

尝试一下 ?

你可以使用中括号([])来删除 JSON 对象的属性：

实例

deletemyObj.sites["site1"]

尝试一下 ?

JSON 数组

数组作为 JSON 对象

实例

["Google", "Runoob", "Taobao"]

JSON 数组在中括号中书写。

JSON 中数组值必须是合法的 JSON 数据类型（字符串, 数字, 对象, 数组, 布尔值或 null）。

JavaScript 中，数组值可以是以上的 JSON 数据类型，也可以是 JavaScript 的表达式，包括函数，日期，及 undefined。

JSON 对象中的数组

对象属性的值可以是一个数组：

实例

{"name":"网站","num":3,"sites":["Google", "Runoob", "Taobao"]}

我们可以使用索引值来访问数组：

实例

x=myObj.sites[0];

尝试一下 ?

循环数组

你可以使用 for-in 来访问数组：

实例

for(iinmyObj.sites){x +=myObj.sites[i] + "<br>";}

尝试一下 ?

你也可以使用 for 循环：

实例

for(i=0; i < myObj.sites.length; i++){x +=myObj.sites[i] + "<br>";}

尝试一下 ?

嵌套 JSON 对象中的数组

JSON 对象中数组可以包含另外一个数组，或者另外一个 JSON 对象：

实例

myObj={"name":"网站", "num":3, "sites": [{"name":"Google", "info":["Android", "Google 搜索", "Google 翻译"]}, {"name":"Runoob", "info":["h5混合开发", "h5混合开发工具", "h5混合开发微信"]}, {"name":"Taobao", "info":["淘宝", "网购"]}]}

我们可以使用 for-in 来循环访问每个数组：

实例

for(iinmyObj.sites){x +="<h1>" + myObj.sites[i].name + "</h1>"; for(jinmyObj.sites[i].info){x +=myObj.sites[i].info[j] + "<br>"; }}

尝试一下 ?

修改数组值

你可以使用索引值来修改数组值：

实例

myObj.sites[1]="Github";

尝试一下 ?

删除数组元素

我们可以使用 delete 关键字来删除数组元素：

实例

deletemyObj.sites[1];

尝试一下 ?

JSON.parse()

JSON 通常用于与服务端交换数据。

在接收服务器数据时一般是字符串。

我们可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象。

语法

JSON.parse(text[, reviver])

参数说明：

text:必需，一个有效的 JSON 字符串。
reviver: 可选，一个转换结果的函数，将为对象的每个成员调用此函数。

JSON 解析实例

例如我们从服务器接收了以下数据：

{"name":"runoob", "alexa":10000, "site":"www.xxx.com"}

我们使用 JSON.parse() 方法处理以上数据，将其转换为 JavaScript 对象：

varobj=JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.xxx.com" }');

解析前要确保你的数据是标准的 JSON 格式，否则会解析出错。
你可以使用我们的在线工具检测：https://c.runoob.com/front-end/53。

解析完成后，我们就可以在网页上使用 JSON 数据了：

实例

<pid="demo"></p><script>var obj=JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }');document.getElementById("demo").innerHTML=obj.name + "：" + obj.site;</script>

尝试一下 ?

从服务端接收 JSON 数据

我们可以使用 AJAX 从服务器请求 JSON 数据，并解析为 JavaScript 对象。

实例

varxmlhttp=newXMLHttpRequest();xmlhttp.onreadystatechange=function(){if(this.readyState==4 && this.status==200){myObj=JSON.parse(this.responseText); document.getElementById("demo").innerHTML=myObj.name; }};xmlhttp.open("GET", "/try/ajax/json_demo.txt", true);xmlhttp.send();

尝试一下 ?

查看服务端数据： json_demo.txt

从服务端接收数组的 JSON 数据

如果从服务端接收的是数组的 JSON 数据，则 JSON.parse 会将其转换为 JavaScript 数组：

实例

varxmlhttp=newXMLHttpRequest();xmlhttp.onreadystatechange=function(){if(this.readyState==4 && this.status==200){myArr=JSON.parse(this.responseText); document.getElementById("demo").innerHTML=myArr[1]; }};xmlhttp.open("GET", "/try/ajax/json_demo_array.txt", true);xmlhttp.send();

尝试一下 ?

查看服务端数据： json_demo_array.txt

异常

解析数据

JSON 不能存储 Date 对象。

如果你需要存储 Date 对象，需要将其转换为字符串。

之后再将字符串转换为 Date 对象。

实例

vartext='{ "name":"Runoob", "initDate":"2013-12-14", "site":"www.runoob.com"}';varobj=JSON.parse(text);obj.initDate=newDate(obj.initDate); document.getElementById("demo").innerHTML=obj.name + "创建日期: " + obj.initDate;

尝试一下 ?

我们可以启用 JSON.parse 的第二个参数 reviver，一个转换结果的函数，对象的每个成员调用此函数。

实例

vartext='{ "name":"Runoob", "initDate":"2013-12-14", "site":"www.runoob.com"}';varobj=JSON.parse(text, function(key, value){if(key=="initDate"){returnnewDate(value); }else{returnvalue;}}); document.getElementById("demo").innerHTML=obj.name + "创建日期：" + obj.initDate;

尝试一下 ?

解析函数

JSON 不允许包含函数，但你可以将函数作为字符串存储，之后再将字符串转换为函数。

实例

vartext='{ "name":"Runoob", "alexa":"function () {return 10000;}", "site":"www.runoob.com"}';varobj=JSON.parse(text);obj.alexa=eval("(" + obj.alexa + ")"); document.getElementById("demo").innerHTML=obj.name + " Alexa 排名：" + obj.alexa();

尝试一下 ?

不建议在 JSON 中使用函数。

浏览器支持

主流浏览器都支持 JSON.parse() 函数：

Firefox 3.5
Internet Explorer 8
Chrome
Opera 10
Safari 4

在线咨询

上一篇：5 个开源的 Java IDE 工具 - Linux
下一篇：画个圈就能知道你得了啥病？请完成这项画图测试

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

整合营销服务商

说说JavaScript的严格模式

一、JavaScript try ... catch语句

二、JavaScript throw语句

三、JavaScript 错误对象

四、错误类型

五、总结

SON 教程

JSON - 简介

JSON 语法

JSON 对象

JSON 数组

JSON.parse()

您的项目需求