JavaScript基础理论

网页、网站和应用程序

网页：单独的一个页面
网站：一些列相关的页面组成到一起
应用程序：可以和用户产生交互，并实现某种功能。

JavaScript介绍

JavaScript是什么

html CSS
行为标准
Netscape（网景）在最初将其脚本语言命名为LiveScript，后来Netscape在与Sun合作之后将其改名为JavaScript。JavaScript最初受Java启发而开始设计的，目的之一就是“看上去像Java”，因此语法上有类似之处，一些名称和命名规范也借自Java。JavaScript与Java名称上的近似，是当时Netscape为了营销考虑与Sun微系统达成协议的结果。
雷锋雷峰塔的关系

JavaScript是一种运行在***客户端*** 的***脚本语言***
JavaScript的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。

JavaScript最初的目的

为了表单的验证操作

JavaScript现在的意义(应用场景)

JavaScript 发展到现在几乎无所不能。

1. 网页特效
2. 服务端开发(Node.js)
3. 命令行工具(Node.js)
4. 控制硬件-物联网(Ruff)
5. 游戏开发(cocos2d-js)
6. 手机App(Cordova)
7. 桌面应用程序(Electorn)

JavaScript和HTML、CSS的区别

1.html：提供网页结构。提供网页的内容

2.css：美化界面

3.js： 控制网页内容，给网页增加动态效果

JavaScript的组成

1.ECMAscript

2.DOM

3.BOM

ECMAScript - JavaScript的核心 （语法）

ECMA 欧洲计算机制造联合会
网景：javascript
微软：JScript
定义了JavaScript的语法规范
JavaScript的核心，描述了语言的基本语法和数据类型，ECMAScript是一套标准，定义了一种语言的标准,与具体实现无关

html不算变成，js算，因为逻辑结构

BOM - 浏览器对象模型

一套操作浏览器功能的API
通过BOM可以操作浏览器窗口，比如：弹出框、控制浏览器跳转、获取分辨率等

DOM - 文档对象模型

一套操作页面元素的API

DOM可以把HTML看做是文档树，通过DOM提供的API可以对树上的节点进行操作

JavaScript初步学习

CSS：行内样式、嵌入样式、外部样式

JavaScript的书写位置

• 写在行内
  `html
  
  写在script标签中

注意点 ***引用外部js文件的script标签中不可以写JavaScript代码*** ## 变量

什么是变量

• 什么是变量

  变量是计算机内存中存储数据的标识符，根据变量名称可以获取到内存中存储的数据

• 为什么要使用变量

  使用变量可以方便的获取或·者修改内存中的数据

如何使用变量

• var声明变量
  javascript
  var age;
• 变量的赋值
  javascript
  var age;
  age = 18;
• 同时声明多个变量
  `javascript
  var age, name, sex;
  age = 10;
  name = ‘zs’;
• 同时声明多个变量并赋值
  javascript
  var age = 10, name = ‘zs’;

变量在内存中的存储

javascript
var age = 18;

变量的命名规则和规范

• 规则-必须遵守的，不遵守会报错
  • 由字母，数字，下划线，$符号组成，不能以数字开头
  • 不能是关键字 和保留字
  • 区分大小写
• 规范：不遵守不报错
  • 变量名一定要有意义
  • 驼峰命名法，userName，首字母小写，后面单词的首字母大写

  • 数据类型

简单数据类型

Number、String、Boolean、Undefined、Null

Number类

• 数值字面量：数值的固定值的表示法
  110 1024 60.5

  String类型

‘abc’ “abc”
字符串字面量
‘今天天气真好’
转义符

• 字符串长度
  length属性用来获取字符串的长度
  字符串拼接
  字符串拼接使用 + 连接
  1.两边只要有一个=是字符串，+就实现拼接功能
  2.都是数字，就是算数功能

注释

单行注释

用来描述下面一个或多行代码的作用
`javascript
// 这是一个变量
var name = ‘him’;

多行注释

用来注释多条代码

javascript
/*
var age = 18;
var name = ‘zs’;
console.log(name, age);

数据类型转换

转换成字符串类型

• toString()

• String()

  存在的意义是，有的属性没有toString方法，这个使用String（）

• 拼接字符串方式

  num + “”，当 + 两边一个操作符是字符串类型，一个操作符是其它类型的时候，会先把其它类型转换成字符串再进行字符串拼接，返回字符串

转换成数值类型

• Number()
• parseInt()
  parseFloat()
• +，-0等运算

转换成布尔类型

• Boolean()

操作符

运算符 operator
5 + 6
表达式 组成 操作数和操作符，会有一个结果

算术运算符

一元运算符

一元运算符：只有一个操作数的运算符

逻辑运算符(布尔运算符)

&& 与 两个操作数同时为true，结果为true，否则都是false
|| 或 两个操作数有一个为true，结果为true，否则为false
! 非 取反

关系运算符(比较运算符)

< > >= <= == != === !==
javascript
与=的区别：==只进行值的比较，===类型和值同时相等，则相等

var result = ‘55’ == 55; // true
var result = ‘55’ === 55; // false 值相等，类型不相等
var result = 55 === 55; // true

赋值运算符

= += -= *= /= %=

表达式和语句

表达式

一个表达式可以产生一个值，有可能是运算、函数调用、有可能是字面量。表达式可以放在任何需要值的地方。

语句

语句可以理解为一个行为，循环语句和判断语句就是典型的语句。一个程序有很多个语句组成，一般情况下;分割一个一个的语句

流程控制

程序的三种基本结构

顺序结构

从上到下执行的代码就是顺序结构

程序默认就是由上到下顺序执行的

分支结构

根据不同的情况，执行对应代码

循环结构

循环结构：重复做一件事情

分支结构

if语句

三元运算符

表达式1 ? 表达式2 : 表达式3
是对if……else语句的一种简化写法

switch语句

语法格式:
`javascript
switch (expression) {
case 常量1:
语句;
break;
case 常量2:
语句;
break;
case 常量3:
语句;
break;
…
case 常量n:
语句;
break;
default:
语句;
break;
}

布尔类型的隐式转换

流程控制语句会把后面的值隐式转换成布尔类型
转换为true 非空字符串 非0数字 true 任何对象
转换成false 空字符串 0 false null undefined
`javascript
// 结果是什么？
var a = !!‘123’;

循环结构

在javascript中，循环语句有三种，while、do…while、for循环。

while语句

基本语法：
javascript
// 当循环条件为true时，执行循环体，
// 当循环条件为false时，结束循环。
while (循环条件) {
//循环体
}

do…while语句

do…while循环和while循环非常像，二者经常可以相互替代，但是do…while的特点是不管条件成不成立，都会执行一次。
基础语法：
`javascript
do {
// 循环体;
} while (循环条件);

for语句

while和do…while一般用来解决无法确认次数的循环。for循环一般在循环次数确定的时候比较方便

for循环语法：
javascript
// for循环的表达式之间用的是;号分隔的，千万不要写成,
for (初始化表达式1; 判断表达式2; 自增表达式3) {
// 循环体4
}

continue和break

break:立即跳出整个循环，即循环结束，开始执行循环后面的内容（直接跳到大括号）

continue:立即跳出当前循环，继续下一次循环（跳到i++的地方）