前端学习（8月10日——8月13日）

四、JS基础

（一）、基础语法

• 理解变量是存储数据的“容器”
• 理解什么是数据并知道数据的分类
• 知道JavaScript数据类型转换的特征

1、JavaScript介绍

（1）、JavaScript

一种运行在客户端（浏览器）的编程语言，实现人机交互效果

（2）、作用

• 网页特效（监听用户的一些行为让网页作出对应的反馈）
• 表单验证（针对表单数据的合法性进行判断）
• 数据交互（获取后台的数据，渲染到前端）
• 服务端编程（node.js）

（3）、组成

• ECMAScript
  规定了js基础语法核心知识
  比如：变量、分支语句、循环语句、对象等等
• Web APIs
  • DOM 操作文档
    比如对页面元素进行移动、大小、添加删除等操作
  • BOM 操作浏览器
    比如页面弹窗，检测窗口宽度、存储数据到浏览器等等

JavaScript权威网站

（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是弱数据类型，需要把一种数据类型的变量转换成我们需要的数据类型

• 隐式转换
  

• 显式转换