web学习笔记(三十三)

目录

1.严格模式

1.1严格模式的概念:

1.2严格模式在语义上更改的地方:

1.3如何开启严格模式 

1.4严格模式应用上的变化 

2.原型链


1.严格模式

1.1严格模式的概念:

      严格模式有点像es5向es6过渡而产生的一种模式,因为es6的语法要求都比较严格,而我们在es5的代码编写过程中使用严格模式会使得我们的代码更加规范,但并不是所有的浏览器都支持严格模式,只有在IE10以上版本的浏览器才会支持严格模式。

1.2严格模式在语义上更改的地方:

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

  1. 消除了 Javascript 语法的一些不合理、不严谨之处,减少了一些怪异行为。
  2. 消除代码运行的一些不安全之处,保证代码运行的安全。
  3. 提高编译器效率,增加运行速度。
  4. 禁用了在 ECMAScript 的未来版本中可能会定义的一些语法,为未来新版本的 Javascript 做好铺垫。比如一些保留字如:class,enum,export, extends, import, super 不能做变量名

1.3如何开启严格模式 

"use strict" //开启严格模式,
//或者在函数内部
function(){
"use strict" //需要写在函数体内所有语句之前
}

如果将该语句直接写在script标签内部则表示开启全局严格模式。如果是写在函数内部,则表示在函数作用域内编写的代码开启严格模式。 

1.4严格模式应用上的变化 

(1)未声明的变量直接赋值输出会报错。(普通模式下不会报错,会将变量前面默认加上window然后将变量升为全局变量,可以在控制台输出变量的值)

    "use strict" //开启严格模式,如果写在函数体内部则表示只有函数内部开启严格模式。a = 10;console.log(a);//严格模式之前可以输出a的值,现在会直接报错。 

(2)不允许删除变量 (普通模式下变量没有真的被删除,但是也不会报错)

  "use strict" //开启严格模式,如果写在函数体内部则表示只有函数内部开启严格模式。 var b = 1;delete b;//严格模式下不可以删除变量,会直接报语法错误。

 (3)函数的this指向是undefined(普通模式下,普通函数的this指向window)

    <script>"use strict" //开启严格模式,如果写在函数体内部则表示只有函数内部开启严格模式。function fn() {console.log(this); //严格模式下函数内this指向undefined}fn();</script>

(4) 构造函数不加new调用,指向结果为undefined,(普通模式下,如果构造函数不使用 new 调用,this 的指向将取决于调用上下文。在非严格模式下,如果没有使用 new,而是将构造函数作为普通函数进行调用,this 会指向全局对象(在浏览器环境中是 window 对象)。)

'use strict';function Person(name) {this.name = name;}var person1 = new Person('Alice');console.log(person1.name); // 输出 "Alice"var person2 = Person('Bob'); // 没有使用 new 关键字调用构造函数  此时由于没有使用 new 关键字,this 被设置为 undefined。在这种情况下,尝试给 undefined.name 赋值会导致报错,因为 undefined 没有 name 属性。console.log(person2); // 输出 undefined

 (5)无论是不是在严格模式下,定时器的this指向都是window。

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

2.原型链

  <script>// 父亲 (构造函数)function Person(name, age) {this.name = name;this.age = age;this.say = function () {console.log('say  person');}}// Person.prototype是原型对象  是一块空间 母亲  有 construtor属性和 __proto__属性Person.prototype.say = function () {console.log('asy');}Person.prototype.walk = function () {console.log('walk');}// 孩子 实例对象 有 construtor属性和 __proto__属性var p1 = new Person('TOM', 20);var p2 = new Person('JACK', 22);console.log(p1);p1.say();p2.say();</script> 

可以简单的理解为构造函数类似于父亲的角色,原型对象类似于母亲的角色,而实例对象类似于孩子的角色。 

 父亲(构造器)有prototype 属性,父亲(构造器)可以通过prototype 属性查找到母亲(原型对象)。

母亲(原型对象)有 construtor(构造器)属性和 __proto__(隐式原型)属性,母亲可以通过construtor属性来查找到父亲(构造函数)。同时可以通过 __proto__(隐式原型)属性来查找到父级函数的原型对象,而父级函数的隐式对象再通过 __proto__(隐式原型)属性网上查找又可以找到上一级函数的原型对象,直到找到最顶部的原型对象,此时再向上查找的结果就是null。

孩子(实例对象)有 construtor(构造器)属性和 __proto__(隐式原型)属性,孩子可以通过 __proto__(隐式原型)属性查找到母亲(原型对象),然后再通过 construtor(构造器)属性查找到父亲(构造函数)或__proto__(隐式原型)属性查找到上级母亲(原型对象)。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/540967.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python爬虫从基础到入门:script标签中的数据

上一篇文章: Python爬虫从基础到入门:script标签中的数据 1. 分析需要抓取的数据的在哪?2. 获取数据、解析数据3. 下载视频、音频文件4. 参考代码1. 分析需要抓取的数据的在哪? 本篇博文以B站视频为例,B站视频在用户没有登录的状态下,只能观看视频尺寸为360流畅,在登录…

C# 读取多条数据记录导出到 Word 标签模板

目录 应用需求 实现步骤 范例运行环境 配置Office DCOM 实现代码 组件库引入 ​编辑 核心代码 小结 应用需求 将数据库数据表中的数据输出并打印&#xff0c;WORD 是一个良好的载体&#xff0c; 在应用项目里&#xff0c;许多情况下我们会使用数据记录结合 WORD 标签模…

面试宝典-【spring】

目录 1.Spring是什么 ? 2.Spring框架中的单例bean是线程安全的吗&#xff1f; 3.IOC容器是什么&#xff1f; 4.什么是依赖注入&#xff1f; 6.什么是AOP &#xff1f; 7.IOC容器初始化过程&#xff1f; 8.Bean的生命周期&#xff1f; 9.BeanFactory和FactoryBean的…

游戏开发需不需要考研?

近年来&#xff0c;中国游戏行业增速放缓&#xff0c;用户基数趋于饱和&#xff0c;行业监管日趋严格&#xff0c;国外竞争激烈&#xff0c;使游戏公司面临挑战。为适应形势&#xff0c;游戏企业正在调整策略&#xff0c;采取主动学习和实战练习的方式&#xff0c;提升游戏质量…

HTML案例-4.注册页面表单练习

效果 知识点 列表标签 无序列表 <ul><li>火锅</li><li>奶茶</li><li>烤肉</li> <ul> 有序列表 <ol><li>蛋挞</li><li>水煮鱼</li><li>麻辣香锅</li> </ol> 自定义列表…

TCP相关特性

协议段格式 • 源/⽬的端⼝号:表⽰数据是从哪个进程来,到哪个进程去; • 32位序号/32位确认号:后⾯详细讲; • 4位TCP报头⻓度:表⽰该TCP头部有多少个32位bit(有多少个4字节);所以TCP头部最⼤⻓度是15*460 • 6位标志位: ◦ URG:紧急指针是否有效 ◦ ACK:确认号是否有效…

朋友,代码库的“健身方案”要不要了解一下?

你有没有想过&#xff0c;你的代码库可能正面临“健康危机”—— 代码臃肿、低效交付、BUG隐藏、潜藏的安全风险…… “健身达人”上线 如果你的开发、安全和运维团队像是三位“健身达人”&#xff0c;那么极狐GitLab的DevSecOps线上成熟度评估&#xff0c;就是他们的“健身教…

SwiftUI组件-DatePicker

SwiftUI组件-DatePicker 本文记录一下SwiftUI组件-DatePicker import SwiftUIstruct DatePickerBootCamp: View {State var selectedDate: Date Date()var dateFormatter: DateFormatter {let formatter DateFormatter()formatter.dateStyle .shortformatter.timeStyle .…

计算机网络—VLAN 配置

目录 1.拓扑图 2.实验环境准备 2.关闭不相关接口&#xff0c;并配置 Trunk 3.创建 VLAN 4.为客户端配置 IP地址 5.检测设备连通性&#xff0c;验证 VLAN 配置结果 6.配置 Hybrid 端口 7.配置文件 1.拓扑图 2.实验环境准备 在S1和S2上创建Eth-Trunk 1并配置该Eth-Trunk…

力扣-20. 有效的括号(回顾知识哈希表,栈)

给定一个只包括 ‘(’&#xff0c;‘)’&#xff0c;‘{’&#xff0c;‘}’&#xff0c;‘[’&#xff0c;‘]’ 的字符串 s &#xff0c;判断字符串是否有效。 有效字符串需满足&#xff1a; 左括号必须用相同类型的右括号闭合。 左括号必须以正确的顺序闭合。 每个右括号都有…

TRACK:使用 Kubo 计算相关电子系统传输特性的 Python 代码

Figure 1 Figure 2 以上是我们分享的一些经验或者文章的搬运&#xff0c;或有不足&#xff0c;欢迎大家指出&#xff01; 如有侵权&#xff0c;请联系我立马删除&#xff01; 详细内容&#xff08;文章题目、文章链接、附件下载&#xff09;可在微 信 公 众 号&#xff1a;原…

vue methods 函数为啥不能是箭头函数

1、首先&#xff0c;因为methods里面的方法中的this是可以拿到data中定义的属性&#xff0c;所以它肯定不是window,但是methods 中 箭头函数里面的this指向window所以methods里面的方法不能定义箭头函数。 下面用代码说明为啥 methods中箭头函数中的this指向window <div i…