寒假集训——六

六十三、计算机语言

计算机语言(Computer Language)指用于人与计算机之间通讯的语言。计算机语言是人与计算机之间传递信息的媒介。计算机系统最大特征是指令通过一种语言传达给机器。为了使电子计算机进行各种工作，就需要有一套用以编写计算机程序的数字、字符和语法规划，由这些字符和语法规则组成计算机各种指令(或各种语句)。这些就是计算机能接受的语言。

六十四、JavaScript基础

1、JavaScript发展历史（JS）

1. 1994年， 网景公司(Netscape)发布了Navigator浏览器0.9版，这是世界上第一款比较成熟的网络浏览器， 轰动一时。但是这是一款名副其实的浏览器–只能浏览页面，浏览器无法与用户互动,当时解决这个问题有两个办法，一个是采用现有的语言，许它们直接嵌入网页。另一个是发明一种全 新的语言。
   livescript => javascript => ECMAsCript

2. 1995年 sun公司将0ak语言改名为Java，正式向市场推出。Sun公司大肆宣传，许诺这种语言可以“一次编写，到处运行”(Write once, Run Anywhere)，它看上去很可能成为未来的主宰。

3. 网景公司动了心， 决定与sun公司结成联盟

4. 34岁 的系统程序员Brendan Eich登场了。 1995年4月，网景公司录用了他,他只用10天时间就把Javascript设计出来了。

5. (1)借鉴C语言的基本语法
   (2)借鉴Java语言的数据类型和内存管理
   (3)借鉴scheme语言，将函数提升到"第一等 公民”(first class) 的地位(4)借鉴Se1f语言，使用基于原型(prototype)的继承机制

2、JavaScript的组成

1. ECMASCRIPT: 定义了javascri pt的语法规范, 描述了语言的基本语法和数据类型
2. BOM (Browser object Mode1): 浏览器对象模型
   -有一套成熟的可以操作浏览器的API， 通过BOM可以操作浏览器。比如:弹出框、 浏览器跳转、获取分辨率等
3. DOM (Document object Mode1): 文档对象模型
   -有一套成熟的可以操作页面元素的API, 通过DOM可以操作页面中的元素。比如:增加个 div, 减少个div,给div换个位置等

总结: JS 就是通过固定的语法去操作浏览器和标签结构来实现网页上的各种效果

六十五、JavaScript代码的书写位置

• 和CSS -样,我们的js也可以有多种方式书写在页面上让其生效
• js也有多种方式书写,分为行内式，内嵌式， 外链式

1.行内式JS代码(不推荐)

• 写在标签.上的js代码需要依靠事件(行为)来触发

<a href="javascript:alert('我是一个弹出层 ');">点击一下试试a>

<div onclick="alert('我是一个弹出层')">点 一下试试看div>

2.内嵌式JS代码

• 内嵌式的js代码会在页面打开的时候直接触发

<script type="text/javascript" >
alert("我是一个弹出层')
script>

3.外链式JS代码(推荐)

• 外链式js代码只要引入了html页面，就会在页面打开的时候直接触发
• 新建一个.js后缀的文件,在文件内书写js代码,把写好的js文件引入html页面

//我是index.js 文件
alert('我是一个弹出层')

<script src="index.js">script>

<script src="index1.js">script>
<script src="index2.js">script>
<script src="index3.js">script>

六十六、JS中的注释

• 学习一个语言，先学习一个语言的注释,因为注释是给我们自己看的,也是给开发人员看的
• 写好一个注释，有利于我们以后阅读代码

六十七、变量(重点)

• 变量指的是在程序中保存数据的一个容器
• 变量是计算机内存中存储数据的标识符，根据变量名称可以获取到内存中存储的数据
• 也就是说，我们向内存中存储了一个数据，然后要给这个数据起一个名字，为了是我们以后再次找到他
• 语法：var变量名=值

1.定义变量及赋值

//定义一个变量
var num;
//给一个变量赋值
num=100;
//定义一个变量的同时给其赋值
var num2 = 200;

• 注意:
  1.一个变量名只能存储一个值
  2.当再次给一个变量赋值的时候，前面一次的值就没有了
  3.变量名称区分大小写(JS 严格区分大小写)

2.变量的命名规则和命名规范

• 规则：必须遵守的，不遵守就是错
  1.-个变量名称可以由数字、字母、英文下划线（_）、美元符号（$）组成
  2.严格区分大小写
  3.不能由数字开头
  4.不能是保留字或者关键字
  5.不要出现空格
• 规范:建议遵守的(开发者默认) ，不遵守不会报错
  1.变量名尽量有意义(语义化)
  2.遵循驼峰命名规则，由多个单词组成的时候，从第二个单词开始首字母大写
  3.不要使用中文

3.数据类型(重点)

• 是指我们存储在内存中的数据的类型
• 我们通常分为两大类基本数据类型和复杂数据类型

基本数据类型

1. 数值类型(number)
   一切数字都是数值类型(包括二进制，十进制，十六进制等)
   NaN (not a number) ，一个非数字

2. 字符串类型(string)
   被引号包裹的所有内容(可以是单引号也可以是双引号)

3. 布尔类型(boolean)
   只有两个(true或者false)

4. null类型(null)

5. undefined类型(undefined)
   只有一个，就是undefined，表示没有值的意思

判断数据类型

• 既然已经把数据分开了类型,那么我们就要知道我们存储的数据是一个什么类型的数据
• 使用typeof关键字来进行判断

//第一种使用方式
var n1 = 100;
console. 1og(typeof n1);
//第二种使用方式
ar s1 = 'abcdefg';
console. 1og(typeof(s1));

六十八、数据类型转换

• 数据类型之间的转换，比如数字转成字符串,字符串转成布尔，布尔转成数字等

1.其他数据类型转成数值

1. Number(变量)
   可以把一个变量强制转换成数值类型
   可以转换小数，会保留小数
   可以转换布尔值
   遇到不可转换的都会返回NaN
2. parseInt(变量)
   从第一位开始检查,是数字就转换，直到一个不是数字的内容
   开头就不是数字,那么直接返回NaN
   不认识小数点，只能保留整数
3. parseFloat(变量)
   从第一位开始检查,是数字就转换，直到一个不是数字的内容
   开头就不是数字，那么直接返回NaN
   认识一次小数点
4. 除了加法以外的数学运算
   运算符两边都是可运算数字才行
   如果运算符任何一边不是一个可运算数字, 那么就会返回NaN
   加法不可以用

2.其他数据类型转成字符串

1. 变量. tostring()
   有一些数据类型不能使用tostring()方法，比如undefined和null
2. String(变量)
   所有数据类型都可以
3. 使用加法运算
   在JS里面，+有两个含义
   字符串拼接：只要+任意一边是字符串，就会进行字符串拼接
   加法运算：只有+两边都是数字的时候，才会进行数学运算

3.其他数据类型转成布尔

Boolean(变量)
在js中，只有"‘’、0、null、undefined、 NaN, 这些是false
其余都是true

六十九、运算符

• 就是在代码里面进行运算的时候使用的符号，不光只是数学运算,我们在js里面还有很多的运算方式

1.数学运算符

1. +
   只有符号两边都是数字的时候才会进行加法运算
   只要符号任意一边是字符串类型，就会进行字符串拼接
2. -
   会执行减法运算
   会自动把两边都转换成数字进行运算
3. *
   会执行乘法运算
   会自动把两边都转换成数字进行运算
4. /
   会执行除法运算
   会自动把两边都转换成数字进行运算
5. %
   会执行取余运算
   会自动把两边都转换成数字进行运算

2.赋值运算符

1. =
   就是把=右边的赋值给等号左边的变量名
   var num = 100
   就是把100赋值给num变量
   那么num变量的值就是100
2. +=

var a=10;
a += 10;
console. 1og(a); //=> 20

a+=10等价于a=a+10

3. -=
   vara= 10;
   a-= 10;
   console.1og(a); //=> 0
   a-=10等价于a=a- 10
4. *=
5. /=
6. %=
   a%=10等价于a=a%10

3.比较运算符

1. ==
   比较符号两边的值是否相等,不管数据类型
   1==‘1’
   两个的值是一样的，所以得到true
2. ===
   比较符号两边的值和数据类型是否都相等
   1===‘1’
   两个值虽然-样,但是因为数据类型不一样，所以得到false
3. !=
   比较符号两边的值是否不等
   1 !=‘1’
   因为两边的值是相等的，所以比较他们不等的时候得到false
4. !==
   比较符号两边的值是否不等
   1!==‘1’
   因为两边的数据类型确实不一样，所以得到true
5. >=
   比较左边的值是否大于或等于右边的值
   1>=1结果是true
   1>=0结果是true
   1>=2结果是false
6. <=
   比较左边的值是否小于或等于右边的值
   1<= 2结果是true
   1<= 1结果是true
   1<= 0结果是false
7. >
   比较左边的值是否大于右边的值
   1>0结果是true
   1>1结果是false
   1>2结果是false
8. <
   比较左边的值是否小于右边的值
   1<2结果是true
   1<1结果是false
   1<0结果是false

4.逻辑运算符

1. &&
   进行且的运算
   符号左边必须为true并且右边也是true,才会返回true只要有一边不是true,那么就会返回false
   true && true结果是true
   true && false 结果是false
   false && true结果是false
   false && false结果是false
2. ||
   进行或的运算
   符号的左边为true或者右边为true,都会返回true只有两边都是false的时候才会返回false
   true I| true 结果是true
   true I| false 结果是true
   false I| true 结果是true
   false II false 结果是false
3. !
   进行取反运算
   本身是true的，会变成false
   本身是false的，会变成true
   !true结果是false
   !false结果是true
4. !!a转换成布尔值
   && || 短路用法

5.自增自减运算符

1. ++
   进行自增运算
   分成两种，前置++和后置++
   前置++，会先把值自动+1，再返回
   var a=10;
   console.1og(++a);
   //会返回11,并且把a的值变成11
   后置++，会先把值返回，在自动+1
   vara=10;
   console. 1og(a++);
2. –
   进行自减运算
   分成两种，前置–和后置–
   和++运算符道理一样

七十、三元运算符

• 三元运算，就是用两个符号组成一个语句
• 语法：条件?条件为true 的时候执行:条件为false 的时候执行

var age = 18;
age >= 18 ? alert('已经成年') : alert('没有成年')

七十一、分支结构

• 我们的js代码都是顺序执行的（从上到下）
• 逻辑分支就是根据我们设定好的条件来决定要不要执行某些代码

1.IF条件分支结构（重点）

if语句

• 通过一个if语句来决定代码是否执行
• 语法: if (条件) {要执行的代码}
• 通()里面的条件是否成立来决定{}里面的代码是否执行

//条件为true 的时候执行{}里面的代码if (true) {
alert('因为条件是true, 我会执行')
//条件为false 的时候不执行{}里面的代码if (false) {
alert('因为条件是false, 我不会执行'

if else语句

• 通过if条件来决定，执行哪-一个{}里面的代码
• 语法: if (条件) {条件为true 的时候执行} else {条件为false 的时候执行}
• 两个{}内的代码一定有一个会执行

//条件为true 的时候，会执行if后面的{}
if (true) {
alert('因为条件是true,我会执行')
} else {
alert('因为条件是true, 我不会执行')
}
//条件为false 的时候，会执行else 后面的{}
if (false) {
alert('因为条件为false, 我不会执行')
} else {
alert('因为条件为false， 我会执行')
}

if else if …语句

• 可以通过if和eIlse if来设置多个条件进行判断
• 语法: if (条件1) {条件1为true的时候执行} else if (条件2) {条件2为true的时候执行}
• 会从头开始依次判断条件
  如果第一个条件为true了,那么就会执行后面的{}里面的内容
  如果第一个条件为false，那么就会判断第二个条件，依次类推
• 多个{}，只会有一个被执行，一旦有一个条件为true 了，后面的就不再判断了

if else if … else语句

• 和之前的if else if …基本- -致,只不过是在所有条件都不满足的时候，执行最后else后面的{}

// 第一个条件为 false,第二个条件为 false,最终会打印“我是代码段3”
//只有前面所有的条件都不满足的时候会执行else 后面的{}里面的代码
//只要前面有一个条件满足了，那么后面的就都不会执行了
if (false) {
alert('我是代码段1')
} else if (false) {
alert('我是代码段2')
}else
alert('我是代码段3')
}

2.SWITCH条件分支结构(重点)

• 也是条件判断语句的一种
• 是对于某一个变量的判断
• 语法:

switch (要判断的变量) {
case 情况1:
情况1要执行的代码
break
case 情况2:
情况2要执行的代码
break
case情况3:
情况3要执行的代码
break
default:
上述情况都不满足的时候执行的代码
}

• 要判断某一个变量等于某一个值得时候使用

七十二、循环结构(重点)

• 循环结构，就是根据某些给出的条件,重复的执行同一段代码
• 循环必须要有某些固定的内容组成

1. 初始化
2. 条件判断
3. 要执行的代码
4. 自身改变

1.WHILE循环

• while, 中文叫当…时, 其实就是当条件满足时就执行代码，一旦不满足了就不执行了
• 语法while (条件) {满足条件就执行}
• 因为满足条件就执行,所以我们写的时候一定要注意,就是设定一个边界值,不然就一直循环下去了

// 1.初始化条件
var num = 0;
// 2.条件判断
while (num < 10) {
// 3.要执行的代码
console. 1og('当前的num的值是' + num)// 4.自身改变
num=num+1
}

• 如果没有自身改变，那么就会一直循环不停了

2.DO WHILE循环

• 是一个和while循环类似的循环
• while 会先进行条件判断，满足就执行，不满足直接就不执行了
• 但是do while循环是，先不管条件,先执行-回, 然后在开始进行条件判断
• 语法: do {要执行的代码} while (条件)

//下面这个代码，条件一开始就不满足， 但是依旧会执行一次do后面{}内部的代码
var num = 10
do {
console. 1og('我执行了一次')
num= num+1
} while (num < 10)

3.FOR循环

• 和while和do while循环都不太一样的一种循环结构
• 道理是和其他两种一样的，都是循环执行代码的
• 语法:for(vari=0;i<10;1++){要执行的代码}

//把初始化，条件判断，自身改变，写在了一起
for(vari=1;i<=10;i++){
//这里写的是要执行的代码
console. 1og(i)
}
//控制台会依次输出1 ~ 10

• 这个只是看起来不太舒服，但是用起来比较好用

4.BREAK终止循环

• 在循环没有进行完毕的时候，因为我设置的条件满足，提前终止循环
• 比如:我要吃五个包子，吃到三个的时候，不能在吃了,我就停止吃包子这个事情要终止循环，就可以直接使用break关键字

for(vari=1;i<=5;1++){
	//每循环一次，吃一个包子
	console.log('我吃了一个包子')
	//当i的值为3的时候，条件为true,执行{}里面的代码终止循环
	//循环就不会继续向下执行了，也就没有4和5了
	if (i===3) {
	break
	}
}

5.CONTINUE结束本次循环

• 在循环中，把循环的本次跳过去，继续执行后续的循环
• 比如:吃五个包子，到第三个的时候，第三个掉地下了，不吃了，跳过第三个，继续吃第四个和第五个
• 跳过本次循环,就可以使用continue关键字

for (vari =1; i <= 5; i++) {
	//当i的值为3的时候，执行{}里面的代码
	// {}里面有continue, 那么本次循环后面的代码就都不执行了
	//自动算作i为3的这一次结束了，去继续执行i = 4的那次循环了
	if(i===3) {
		console. log('这个是第三个包子，掉地下了，我不吃了')
		continue
	}
	console.log('我吃了一个包子')
}