JS查漏补缺——ECMAScript相关

简介: JS查漏补缺系列是我在学习JS高级语法时做的笔记,通过实践费曼学习法进一步加深自己对其的理解,也希望别人能通过我的笔记能学习到相关的知识点。这一次我们来了解ECMAScript相关语法中的大小写和严格模式

大小写

ECMAScript中的一切都是区分大小写的,无论是变量操作符还是函数名,如:Typeof 和 typeof 是不一样的

严格模式

ES5中增加,是一种不同的JS解析和执行模型,通过在脚本开头或者函数体内部增加use strict字符这个预处理指令,开启严格模式,一些不规则的(ECMA3)写法在这里会抛出异常。
设立"严格模式"的目的,主要有以下几个:

  • 消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为;
  • 消除代码运行的一些不安全之处,保证代码运行的安全;
  • 提高编译器效率,增加运行速度;
  • 为未来新版本的Javascript做好铺垫。

开启严格模式:

  • 严格模式通过在脚本或函数的头部添加 use strict; 表达式来声明。
  • use strict并不严格限制一定要写在第一行。前边无产生实际运行结果的语句,use strict可以不在第一行
// 整个脚本都开启严格模式的语法
"use strict";
var v = "Hi!  I'm a strict mode script!";

//单独在某个函数内开启严格模式
function a (){
    "use strict";
    //函数体
}
//use strict可以不在第一行
function(){
    "asd";
    "use strict";
    a = 1;
}

严格模式 vs 正常模式

正常模式 严格模式
一个变量没有声明就赋值 默认是全局变量 全局变量必须显式声明(先用var命令声明,然后再使用)
对于静默失败(不报错也没有任何效果)的赋值操作 如:给NaN赋值 不给效果也不报错 报错
试图删除(不可删除的属性/变量/对象/函数)
delete Object.prototype;
不给效果也不报错 报错
对象有多个重名属性 允许重名属性,只有最后一个属性起作用 报语法错误
函数有多个重名的参数
function f(a, a, b) {
return ;
}
可以用arguments[i]读取 报语法错误
八进制数字语法 整数的第一位如果是0,表示这是八进制数,比如0100等于十进制的64 禁止八进制数字语法,使用会报语法错误

严格模式下的eval和arguments

eval

  1. 变量名不能使用 "eval" 字符串(不能通过程序语法被绑定 (be bound) 或赋值)
"use strict";
var eval = 1;         // 报错
  1. eval作用域: 在eval里面生成的变量只能用于eval内部
 "use strict";
  var a = 1;
console.info(eval("var a = 2; a"))  // 2
console.info(x)  //1

eval ("var a = 2");
alert (a);               // 报错

arguments

arguments是函数的参数对象

  1. arguments 不能通过程序语法被绑定 (be bound) 或赋值
"use strict";
  arguments++; // 语法错误
  var obj = { set p(arguments) { } }; // 语法错误
  try { } catch (arguments) { } // 语法错误
  function arguments() { } // 语法错误
  var f = new Function("arguments", "'use strict'; return 17;"); // 语法错误
  1. 参数的值不会随 arguments 对象的值的改变而变化
function f(a) {
    a = 2;
    return [a, arguments[0]];
  }
  f(1); // 正常模式为[2,2]

  function f(a) {
    "use strict";
    a = 2;
    return [a, arguments[0]];
  }
  f(1); // 严格模式为[2,1]
  1. 不再支持 arguments.callee
"use strict";
  var f = function() { return arguments.callee; };
  f(); // 报错
🚨 ES6 的模块自动采用严格模式,不管你有没有在模块头部加上 "use strict";

参考资料:
菜鸟教程:https://www.runoob.com/js/js-strict.html
《JavaScript高级程序设计》
MDN: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Strict_mode
阮一峰的网络日志:https://www.ruanyifeng.com/blog/2013/01/javascript_strict_mode.html

目录
相关文章
|
1月前
|
JavaScript 前端开发 API
ECMAScript和JavaScript的区别是什么?
【4月更文挑战第11天】ECMAScript和JavaScript的区别是什么?
13 1
|
2月前
|
缓存 JavaScript 前端开发
深入理解 ECMAScript modules:提升你的 JavaScript 技能(五)
深入理解 ECMAScript modules:提升你的 JavaScript 技能(五)
|
2月前
|
JavaScript 前端开发
深入理解 ECMAScript modules:提升你的 JavaScript 技能(四)
深入理解 ECMAScript modules:提升你的 JavaScript 技能(四)
|
1天前
|
Web App开发 JavaScript 前端开发
Ecmascript 和javascript的区别
Ecmascript 和javascript的区别
7 0
|
11天前
|
存储 JavaScript 前端开发
【JavaScript技术专栏】ECMAScript 6+新特性详解
【4月更文挑战第30天】ES6(ES2015)标志着JavaScript的重大更新,引入了类和模块、箭头函数、模板字符串、解构赋值、Promise、新数据类型Symbol、Set和Map集合等特性,提高了语言表达力和开发效率。后续版本继续添加新特性,如ES2016的`Array.prototype.includes`,ES2017的`async/await`,以及ES2018的`Object/rest`。学习和掌握这些特性对于提升开发质量和效率至关重要。
|
2月前
|
JavaScript 前端开发 API
【热门话题】ECMAScript vs JavaScript:理解两者间的联系与区别
**ECMAScript是JavaScript的规范,定义语言核心如语法和数据类型;JavaScript是其实现,浏览器中的实现包括额外的API和库。两者关系:蓝图与建筑,规范与实现。了解此区分有助于精准开发。**
30 6
|
2月前
|
JavaScript 前端开发 开发者
深入理解 ECMAScript modules:提升你的 JavaScript 技能(六)
深入理解 ECMAScript modules:提升你的 JavaScript 技能(六)
|
2月前
|
JavaScript 前端开发
深入理解 ECMAScript modules:提升你的 JavaScript 技能(三)
深入理解 ECMAScript modules:提升你的 JavaScript 技能(三)
|
2月前
|
JavaScript 前端开发 开发者
深入理解 ECMAScript modules:提升你的 JavaScript 技能(一)
深入理解 ECMAScript modules:提升你的 JavaScript 技能(一)
|
9月前
|
JSON JavaScript 前端开发
详解JavaScript(ECMAScript与DOM)(中)
详解JavaScript(ECMAScript与DOM)(中)