码迷,mamicode.com
首页 > 编程语言 > 详细

246 JavaScript严格模式

时间:2020-01-23 19:40:53      阅读:85      评论:0      收藏:0      [点我收藏+]

标签:效率   init   代码块   情况下   es5   方式   char   文件   模式   

3.1 什么是严格模式

JavaScript 除了提供正常模式外,还提供了严格模式(strict mode)。

ES5 的严格模式是采用具有限制性 JavaScript变体的一种方式,即在严格的条件下运行 JS 代码。

严格模式在 IE10 以上版本的浏览器中才会被支持,旧版本浏览器中会被忽略。

严格模式对正常的 JavaScript 语义做了一些更改:

1.消除了 Javascript 语法的一些不合理、不严谨之处,减少了一些怪异行为。

2.消除代码运行的一些不安全之处,保证代码运行的安全。

3.提高编译器效率,增加运行速度。

4.禁用了在 ECMAScript 的未来版本中可能会定义的一些语法,为未来新版本的 Javascript 做好铺垫。比如一些保留字如:class,enum,export, extends, import, super 不能做变量名


3.2 开启严格模式

严格模式可以应用到整个脚本或个别函数中。因此在使用时,我们可以将严格模式分为为脚本开启严格模式和为函数开启严格模式两种情况。


  • 情况一 : 为脚本开启严格模式

    • 有的 script 脚本是严格模式,有的 script 脚本是正常模式,这样不利于文件合并,所以可以将整个脚本文件放在一个立即执行的匿名函数之中。这样独立创建一个作用域而不影响其他
      script 脚本文件。

      (function (){
        //在当前的这个自调用函数中有开启严格模式,当前函数之外还是普通模式
          "use strict";
             var num = 10;
          function fn() {}
      })();
      
      //或者 
      <script>
         "use strict"; //当前script标签开启了严格模式
      </script>
      
      <script>
                  //当前script标签未开启严格模式
      </script>

  • 情况二: 为函数开启严格模式

    • 要给某个函数开启严格模式,需要把“use strict”; (或 ‘use strict‘; ) 声明放在函数体所有语句之前。

      function fn(){
        "use strict";
        return "123";
      } 
      //当前fn函数开启了严格模式

3.3 严格模式中的变化

严格模式对 Javascript 的语法和行为,都做了一些改变。

1、变量规定

① 在正常模式中,如果一个变量没有声明就赋值,默认是全局变量。严格模式禁止这种用法,变量都必须先用 var 命令声明,然后再使用。

② 严禁删除已经声明变量。例如,delete x; 语法是错误的。


2、严格模式下 this 指向问题

① 以前在全局作用域函数中的 this 指向 window 对象。
② 严格模式下全局作用域中函数中的 this 是 undefined。
③ 以前构造函数时不加 new也可以 调用,当普通函数,this 指向全局对象
④ 严格模式下,如果 构造函数不加new调用, this 指向的是undefined 如果给他赋值则 会报错
⑤ new 实例化的构造函数指向创建的对象实例。
⑥ 定时器 this 还是指向 window 。
⑦ 事件、对象还是指向调用者。


3、函数变化

① 函数不能有重名的参数。

② 函数必须声明在顶层.新版本的 JavaScript 会引入“块级作用域”( ES6 中已引入)。为了与新版本接轨, 不允许在非函数的代码块内声明函数


'use strict'
num = 10 
console.log(num)//严格模式后使用未声明的变量

--------------------------------------------------------------------------------

var num2 = 1;
delete num2;//严格模式不允许删除变量

--------------------------------------------------------------------------------

function fn() {
 console.log(this); // 严格模式下全局作用域中,函数中的 this 是 undefined 【一般情况下是指向window的,严格模式下他找不到指向的对象,自然指向的就是undefined。】
}
fn();  

---------------------------------------------------------------------------------
    
function Star() {
     this.sex = '男';
}
// Star();严格模式下,如果 构造函数不加new调用, this 指向的是undefined 如果给它赋值,则会报错.
var ldh = new Star();
console.log(ldh.sex);

----------------------------------------------------------------------------------

setTimeout(function() {
  console.log(this); //严格模式下,定时器 this 还是指向 window
}, 2000);  

更多严格模式要求参考

<!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>Document</title>
</head>

<body>
    <script>
        'use strict';
        // 1. 我们的变量名必须先声明再使用
        // num = 10;
        // console.log(num);
        var num = 10;
        console.log(num);


        // 2.我们不能随意删除已经声明好的变量 【var、let以及const创建的不可设置的属性不能被delete操作删除。任何使用var声明的变量都会被标记为不可设置的。任何使用 var 声明的属性不能从全局作用域或函数的作用域中删除。任何用let或const声明的属性不能够从它被声明的作用域中删除。】
        delete num;


        // 3. 严格模式下全局作用域中函数中的 this 是 undefined。【一般情况下是指向window的,严格模式下他找不到指向的对象,自然指向的就是undefined。】
        function fn() {
            console.log(this); // undefined。
        }
        fn();


        // 4. 严格模式下, 如果构造函数不加new调用, this 指向的是undefined,如果给它赋值,则报错. 【如果给this添加属性并赋值,则报错。】
        function Star() {
            this.sex = '男';
        }
        // Star();
        var ldh = new Star();
        console.log(ldh.sex);


        // 5. 定时器 this 还是指向 window 
        setTimeout(function() {
            console.log(this);
        }, 2000);


        // 6. 严格模式下函数里面的参数不允许有重名         
        function fn(a, a) { // a = 1; a = 2;
            console.log(a + a);
        };
        fn(1, 2);
        function fn() {}
    </script>
</body>

</html>

246 JavaScript严格模式

标签:效率   init   代码块   情况下   es5   方式   char   文件   模式   

原文地址:https://www.cnblogs.com/jianjie/p/12231026.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!