四、JS基础
(一)、基础语法
- 理解变量是存储数据的“容器”
- 理解什么是数据并知道数据的分类
- 知道JavaScript数据类型转换的特征
1、JavaScript介绍
(1)、JavaScript
一种运行在客户端(浏览器)的编程语言,实现人机交互效果
(2)、作用
- 网页特效(监听用户的一些行为让网页作出对应的反馈)
- 表单验证(针对表单数据的合法性进行判断)
- 数据交互(获取后台的数据,渲染到前端)
- 服务端编程(node.js)
(3)、组成
- ECMAScript
规定了js基础语法核心知识
比如:变量、分支语句、循环语句、对象等等 - Web APIs
- DOM 操作文档
比如对页面元素进行移动、大小、添加删除等操作 - BOM 操作浏览器
比如页面弹窗,检测窗口宽度、存储数据到浏览器等等
- DOM 操作文档
(4)、书写位置
- 内部
直接写在html文件里,用script标签包住- 规范:script标签写在< /body >上面
- 拓展:alter(‘你好,js’)页面弹出警告对话框
我们将< script >放在HTML文件的底部附近的原因是浏览器会按照代码在文件中的顺序加载HTML
如果先加载的JavaScript期望修改其下方的HTML,那么它可能由于HTML尚未被加载而失效
因此,将JavaScript代码放在HTML页面的底部附近通常是最好的策略
- 外部
代码写在以.js 结尾的文件里- 语法:通过script标签,引入到html页面中
script标签中间无需写代码,否则会被忽略
外部JavaScript会使代码更加有序,更易于复用,且没有了脚本的混合,HTML也会更加易读,因此这是个好的习惯
- 内联
代码写在标签内部- 语法
(5)、书写
- 注释
- 结束符
(6)、输入输出语法
- 目标:能写出常见JavaScript输入输出语法
- 输出语法
- 输入语法
(6)、字面量
2、变量
(1)、定义
计算机中用来存储数据的“容器”,简单理解是一个个的盒子
(2)、基本使用
- 声明变量
let 变量名
-
- 构成:声明关键字、变量名(标识)
- let即关键字,所谓关键字是系统提供的专门用来声明(定义)变量的词语
- 变量赋值
= 赋值运算符 - 更新变量
注意:let不允许多次声明一个变量
- 声明多个变量
变量赋值后,还可以通过简单地给它一个不同的值来更新它- 语法:多个变量中间用逗号隔开
- 说明:看上去代码更短,但并不推荐这样。为了更好的可读性,请一行只声明一个变量
(3)、本质
程序在内存中申请的一块用来存放数据的小空间
(4)、命名规则与规范
-
规则:必须遵守,不遵守报错(法律层面)
-
规范:建议,不遵守不会报错,但不符合业内通识(道德层面)
(5)、let和var的区别
(6)、数组
3、常量
- 概念:使用const声明的变量
- 使用场景:当某个变量永远不会改变的时候,就可以使用const来声明,而不是let
- 命名规范:和变量一致
- 常量使用
- 注意:常量不允许重新赋值,声明的时候必须赋值(初始化)
- 小技巧:不需要重新赋值的数据使用const
4、数据类型
- 分类
- 基本数据类型
- 基本数据类型
字符串拼接:+ 数字相加,字符相连
模版字符串 用反引号包含数据,用 $(变量名) 使用变量
- 引用数据类型
5、类型转换
JS是弱数据类型,需要把一种数据类型的变量转换成我们需要的数据类型
-
隐式转换
-
显式转换