JavaScript (JS) 的基本概念

最新推荐文章于 2022-04-20 11:16:27 发布

末贵

最新推荐文章于 2022-04-20 11:16:27 发布

阅读量266

点赞数

分类专栏： Js&JQuery 文章标签： javascript js

本文链接：https://blog.youkuaiyun.com/moguicy123/article/details/115199961

版权

Js&JQuery 专栏收录该内容

18 篇文章

订阅专栏

JavaScript 基本概念目录

JavaScript (JS) 的概念
JavaScript API
浏览器的标签页就是JavaScript的运行环境
如何添加JavaScript
解决调用顺序的问题
async和defer解决加载和依赖的问题

JavaScript (JS) 的概念

首先JavaScript(JS)是一种编程语言
他的特性是：

函数优先
轻量级
即时编译（解释执行——无需编译）
JavaScript能做什么
可以在网页中实现复杂的功能，使网页给你展现动态而非静态的信息。
如：交互式地图，2D/3D 动画，滚动播放的视频.

其他概念

其中最广为人知的是作为Web脚本语言。但也被用于许多非Web环境中
JavaScript 是基于原型编程、多范式的动态脚本语言，支持面向对象、命令式和声明式（如函数式编程）风格
JavaScript 的标准是 ECMAScript
ECMAScript 6 也称之为 ES6
ECMAScript 是一种规范，而JavaScript是规范的一种具体实现
JavaScript和Java除了名字开始几个字母比较巧合的相同之外，没有任何的关联。

JavaScript API

JavaScript的用途虽然不止是Web浏览器的运用，但是在这里只针对Web浏览器而言
API 通常分为两类

浏览器 API，如：文档对象模型 (DOM)接口
第三方 API，例如：Jquery，Vue等

浏览器的标签页就是JavaScript的运行环境

浏览器的每一个标签就是运行JavaScript代码的独立容器（也可以称之为运行环境）。
每个标签页中的代码完全独立运行，而不能影响其他标签的中的代码，或者被其他标签中的代码所影响。

浏览器执行 JavaScript 代码时，会按从上往下的顺序执行。
所以代码顺序很重要。

如何添加JavaScript

使用script标签

<!--DOCTYPE html-->
<html>
<head>
</head>
<body>
	<script>
		//在标签中写JavaScript代码
	</script>
</body>
</html>

引入外部JavaScript文件

使用标签

<script src="your.js" async></script>

这里使用了【async】新特性，否则会立即执行

内联的JavaScript使用

<button onclick="alert('test')">你过来呀</button>

但是不建议这样使用，因为这样会使得js跟html混杂在一起，使得代码混乱不易维护。

解决调用顺序的问题

因为JavaScript是解释型顺序执行的，所以需要使用一些方法来使得在元素加载完成后执行

内部文件使用

<!--DOCTYPE html-->
<html>
	<head>
		<title>添加JavaScript代码</title>
	</head>
	<body>
		<button>click me</button>
		<script>
			document.addEventListener("DOMContentLoaded", function() {
				//你的JavaScript代码
			});
		</script>
	</body>
</html>