位置: IT常识 - 正文
[JavaScript你真的以为这么简单吗]JavaScript高级
编辑：rootadmin推荐整理分享[JavaScript你真的以为这么简单吗]JavaScript高级，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:,内容如对您有帮助，希望把文章链接给更多的朋友！
✅作者简介：大家好,我是Philosophy7？让我们一起共同进步吧！🏆 📃个人主页：Philosophy7的csdn博客 🔥系列专栏： 👑哲学语录: 承认自己的无知，乃是开启智慧的大门 💖如果觉得博主的文章还不错的话，请点赞👍+收藏⭐️+留言📝支持一下博>主哦🤞
⭐学习目标: -掌握script标签的具体用法 -理解行内脚本与外部脚本的区别 -理解文档模式对JavaScript的影响 -ECMAScript的语法文章目录一、JavaScript初体验1、script元素1.1 标签位置1.2 废弃的语法2.行内代码与外部文件3.文档模式4.小结二、ECMAScript语法1、语法1.1、区分大小写1.2、标识符1.3、注释1.4、严格模式1.5、语句1.6、关键字与保留字2、变量2.1、var关键字作用域2.2、let关键字2.3、const关键字3、数据类型3.1、深入字符串字符串的特点:字符出的转换:字符串的字面量3.2、Symbol 类型(了解即可)3.3、Object类型4.运算符1.算数运算符减法乘法除法取余2.赋值运算符5.语句1.if语句2.do-while3.while4.for5.for-in6.break-continue语句7.switch一、JavaScript初体验1、script元素在HTML中插入JavaScript，我们使用的是script标签。这个元素是被网景公司创造出来的，并最早在Netscape Navigator 2 中实现的。后来，这个元素被正式加入到 HTML 规范。script元素有下列八个属性，分别为:
async : 可选。表示立即下载脚本，但不阻止其他页面的效果。只对外部脚本有效charset : 可选。使用src属性指定的代码字符集。不常用，因为大多数浏览器不在乎。crossorigin : 配置相关请求的CORS（跨源资源共享）设置。默认不使用CORS。defer：可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。integrity：可选。允许比对接收到的资源和指定的加密签名以验证子资源完整性（SRI， Subresource Integrity）。language：废弃。最初用于表示代码块中的脚本语言（如"JavaScript"、“JavaScript 1.2” 或"VBScript"）。大多数浏览器都会忽略这个属性，不应该再使用它。src：可选。表示包含要执行的代码的外部文件。type：可选。代替 language，表示代码块中脚本语言的内容类型（也称 MIME 类型）。按照惯 例，这个值始终都是"text/javascript"，尽管"text/javascript"和"text/ecmascript" 都已经废弃了。使用JavaScript方式有两种:
HTML中直接使用
外部引入
使用 src 属性。这个属性的值是一个 URL，指向包含 JavaScript 代码的文件，比如：下面的例子
这个例子在页面中加载了demo.js
注意:
使用了 src 属性的标签中再包含其他 JavaScript 代码。如果两者都提供的话，则浏览器只会下载并执行脚本文件，从而忽略行内代码。
<body><script> //内部使用script alert("Hello World")</script><!--2.外部引入Js文件--><script src="demo.js"/></body>Js文件
document.write("Hello Alert")浏览器的执行流程:
在有多个script标签时，浏览器会依照从上到下的顺序去解释并执行它们，前提是没有defer和async属性。
1.1 标签位置我们可以看到有的script标签被放在head标签内，如下:
<!DOCTYPE html><html lang="en" xmlns:th="http://www.thymeleaf.org"><head> <meta charset="UTF-8"> <title>JS初体验</title> <script src="demo.js"></script> <script src="demo.js"></script></head><body><script> //内部使用script alert("Hello World")</script><!--2.外部引入Js文件--><script src="demo.js"/></body></html>为什么这样做呢：
主要目的是把外部的 CSS 和 JavaScript 文件都集中放到一起。
不过，把所有 JavaScript 文件都放在里，也就意味着必须把所有 JavaScript 代码都下载、解析和解释完成后，才能开始渲 染页面（页面在浏览器解析到的起始标签时开始渲染）。
对于需要很多 JavaScript 的页面，这会 导致页面渲染的明显延迟，在此期间浏览器窗口完全空白。
为了解决这个问题，我们将script引用到了body标签内，这就表示浏览器在解释JS代码之前就完全渲染了整个页面。
1.2 废弃的语法自 1995 年 Netscape 2 发布以来，所有浏览器都将 JavaScript 作为默认的编程语言。
type 属性使用 一个 MIME 类型字符串来标识script的内容 但 MIME 类型并没有跨浏览器标准化。
即使浏览器默 认使用 JavaScript，在某些情况下某个无效或无法识别的 MIME 类型也可能导致浏览器跳过（不执行） 相关代码。
在最初采用 script 元素时，它标志着开始走向与传统 HTML 解析不同的流程。对这个元素需要应 用特殊的解析规则，而这在不支持 JavaScript 的浏览器（特别是 Mosaic）中会导致问题。不支持的浏览器会把script元素的内容输出到页面中
![[JavaScript你真的以为这么简单吗]JavaScript高级](https://www.jiuchutong.com/image/20231126/1700986061.jpg)
Netscape 联合 Mosaic 拿出了一个解决方案，对不支持 JavaScript 的浏览器隐藏嵌入的 JavaScript 代 码。最终方案是把脚本代码包含在一个 HTML 注释中
<script><!--function sayHi(){document.write("Hi");}--></script>2.行内代码与外部文件可以直接在 HTML 文件中嵌入 JavaScript 代码，但通常认为最佳实践是尽可能将 JavaScript 代 码放在外部文件中
使用外部文件的好处:
可维护性。JavaScript 代码如果分散到很多 HTML 页面，会导致维护困难。而用一个目录保存 所有 JavaScript 文件，则更容易维护，这样开发者就可以独立于使用它们的 HTML 页面来编辑 代码。缓存。浏览器会根据特定的设置缓存所有外部链接的 JavaScript 文件，这意味着如果两个页面都 用到同一个文件，则该文件只需下载一次。这最终意味着页面加载更快适应未来。通过把 JavaScript 放到外部文件中，包含外部 JavaScript 文件的语法在 HTML 和 XHTML 中是一样的。在配置浏览器请求外部文件时，要重点考虑的一点是它们会占用多少带宽。在 SPDY/HTTP2 中， 预请求的消耗已显著降低，以轻量、独立 JavaScript 组件形式向客户端送达脚本更具优势。
3.文档模式IE5.5 发明了文档模式的概念，即可以使用 doctype 切换文档模式。
最初的文档模式有两种：混杂 模式（quirks mode）和标准模式（standards mode）。
前者让 IE 像 IE5 一样（支持一些非标准的特性）， 后者让 IE 具有兼容标准的行为。
虽然这两种模式的主要区别只体现在通过 CSS 渲染的内容方面，但对 JavaScript 也有一些关联影响，或称为副作用。
4.小结要包含外部 JavaScript 文件，必须将 src 属性设置为要包含文件的 URL。文件可以跟网页在同 一台服务器上，也可以位于完全不同的域所有script元素会依照它们在网页中出现的次序被解释。在不使用 defer 和 async 属性的 情况下，包含在script元素中的代码必须严格按次序解释对不推迟执行的脚本，浏览器必须解释完位于script元素中的代码,才能继续渲染页面二、ECMAScript语法1、语法ECMAScript很大程度上借鉴了Java中的语法，熟悉Java的小伙伴应该学习起来会非常的容易，并且熟悉，
而且JavaScript是一门弱类型语言，也就意味着语法的约束倒没有那么严格，可以轻松的掌握。
1.1、区分大小写ECMAScript 中一切都区分大小写。无论是变量、函数名还是操作符，都区分大小写。
换句话说，变量 test 和变量 Test 是两个不同的变量。类似地，typeof 不能作为函数名，因 为它是一个关键字（后面会介绍）。但 Typeof 是一个完全有效的函数名。
<script> //这是两个不同的变量名 var test = 1; var Test = 2;</script>1.2、标识符所谓标识符，就是变量、函数、属性或函数参数的名称。标识符的规则:
第一个字符必须是字母、下划线_ 或者美元符号($)剩下的字母可以是数字、字母、美元符号下划线按照我们熟悉的方式，ECMAScript标识符也使用了驼峰命名的规则，即第一个单词首字母小写，后面的每个单词首字母大写。
例如:
firstNameselectStudentmyMoney虽然这些不做强制要求，但是为了增加我们代码的可读性，还是建议如此的去命名。
关键字、保留字、布尔类型、null不能作为标识符
1.3、注释ECMAScript和Java中的注释一致
<script>//这是单行注释 双斜杠/*这是多行注释*/</script>1.4、严格模式ECMAScript 5 增加了严格模式（strict mode）的概念。严格模式是一种不同的 JavaScript 解析和执 行模型，ECMAScript 3 的一些不规范写法在这种模式下会被处理，对于不安全的活动将抛出错误。
<script> //在开头就采用严格模式 "use strict" //这是两个不同的变量名 var test = 1; var Test = 2;</script>1.5、语句ECMAScript 中的语句以分号结尾。
加分号也便于开发者通过删除空行来压缩代码（如果没有结尾的分号，只删除空行，则会导致语法错误）。
加分号也有助于在某些情况下提升性能，因为解析器会尝试在合适的位置补上分号以纠正语法错误。
<script> var a = 10 //没有分号 不报错 但不推荐 var b = 5; //推荐加上分号</script>1.6、关键字与保留字这些关键字，有着独特的作用，因此，按照规定关键字和保留字不能作为标识符或属性名。
有关键字如下:
breakdointypeofcaseelseinstanceofvarcatchexportnewvoidclassextendsreturnwhildconstfinallysuperwithcontinueforswitchyielddebuggerfunctionthisthrow2、变量ECMAScript 变量是松散类型的，意思是变量可以用于保存任何类型的数据。每个变量只不过是一个用于保存任意值的命名占位符。
有 3 个关键字可以
上一篇：如何用Python求解微分方程组(如何用python求解航天器追逃博弈)
下一篇：【云原生 | 23】Docker运行Web服务实战之Tomcat(云原生是什么)
