前端基础之JavaScript引入

合集 - 前端炒米粉(25)

1.前端基础之前端知识引入2024-03-182.前端基础之HTTP协议介绍2024-03-183.前端基础之HTML基础2024-03-184.前端基础之HTML进阶2024-03-185.前端基础之CSS基础2024-03-196.前端基础之CSS选择器2024-03-197.前端基础之CSS基本属性2024-03-198.前端基础之CSS浮动和定位方式2024-03-199.CSS小练习2024-03-19

10.前端基础之JavaScript引入2024-03-19

11.前端基础之JavaScript的数据类型2024-03-1912.前端基础之JavaScript数组2024-03-2113.前端基础之JavaScript运算符2024-03-2114.前端基础之JavaScript流程控制2024-03-2115.前端基础之JavaScript函数2024-03-2116.前端基础之JavaScript对象2024-03-2117.前端基础之JavaScriptDOM和BOM2024-03-2118.前端基础之原生js事件绑定案例2024-03-2119.前端基础之jQuery引入2024-03-2320.前端基础之jQuery基础2024-03-2321.前端基础之jQuery进阶2024-03-2322.前端基础之jQuery事件2024-03-2323.前端基础之jQuery重要补充2024-03-2324.前端框架之Bootstrap2024-03-2425.前端补充：url编码2024-04-09

收起

一、什么是JavaScript

JavaScript是一门跨平台、面向对象的脚本语言（不需要编译，直接解释运行即可），来控制网页的行为，它能使网页可交互。

脚本语言：不需要编译，运行过程中由 js 解释器( js 引擎）逐行来进行解释并执行。

现在也可以基于 Node.js 技术进行服务器端编程

W3C标准：

网页主要由三部分构成

• 结构：HTML
• 表现：CSS
• 行为：JavaScript

JavaScript和Java是完全不同的语言，不论是概念还是设计。但是在基础语法上类似。

JavaScript（简称：JS）在1995年由Brendan Eich发明，并于1997年成为一部ECMA标准。

ECMAScript 6（ES6）是最新的JavaScript版本（发布于2015年）

ECMAscript和JavaScript的关系：前者是后者的规格，后者是前者的实现

JS版本：

• 主要还是用的5.1和6.0

总结：

• JS是由ECMAScript、DOM、BOM组成
• JS是运行在浏览器脚本的语言

二、JavaScript的作用

1、表单动态校验（密码强度检测） （ JS 产生最初的目的 ）
2、网页特效
3、服务端开发(Node.js)
4、桌面程序(Electron)
5、App(Cordova)
6、控制硬件-物联网(Ruff)
7、游戏开发(cocos2d-js)

三、注释语法

// 单行注释
 
/*
多行注释
多行注释
多行注释
*/

四、JavaScript的引入方式

（1）方式一

内部脚本：将JS代码定义在HTML页面中

在HTML中，JavaScript代码必须位于与标签之间

 <script>
        /*弹出警告框*/
        alert("hello js");
</script>

提示：

• 在HTML文档中可以在任意地方，放置任意数量的<script>
• 一般把脚本置于元素的底部，可改善显示速度，因为脚本执行会拖慢显示

（2）方式二

外部标签：将JS代码定义在外部JS文件中，然后script标签src属性引入外部js代码

外部文件：demo.js

alert("hello js");

引入外部js文件:

<script src="../js/demo.js"></script>

注意：

外部文件不能包含<script>标签

# js语法结构
js是以分号座位语句的结束
但是如果你不写分号，问题也不大，也能够正常执行，但是他就相当于没有结束符

五、JavaScript语法结构

• 区分大小写：与Java一样，变量名、函数名以及其他一切东西都是区分大小写的
• 每行结尾的分号可有可无
• 大括号表示代码块

if(count == 3){
   alter(count);
}

六、如何学习JS

（1）JS书写位置

• pycharm提供的js文件
• 浏览器提供的js环境(学习阶段推荐)

（2）JS学习路线

• 变量
• 数据类型
• 流程控制
• 函数
• 对象
• 内置方法/模块