Study Day09-9.20

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

雷锋雷峰塔的关系

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

JavaScript最初的目的

为了表单的验证操作

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

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

网页特效
服务端开发(Node.js)
命令行工具(Node.js)
控制硬件-物联网(Ruff)
游戏开发(cocos2d-js)
手机App(Cordova)
桌面应用程序(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的书写位置

写在行内

<input type="button" value="按钮" onclick="alert('Hello World')" />

写在script标签中

<head>
  <script>
    alert('Hello World!');
  </script>
</head>

写在外部js文件中，在页面引入

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

注意点

引用外部js文件的script标签中不可以写JavaScript代码

变量

什么是变量

什么是变量

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

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

如何使用变量

var声明变量

var age;

变量的赋值

var age;
age = 18;

同时声明多个变量

var age, name, sex;
age = 10;
name = 'zs';

同时声明多个变量并赋值

var age = 10, name = 'zs';

变量在内存中的存储

var age = 18;

变量的命名规则和规范

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

下面哪些变量名不合法

a	        对
1           错
age18       对
18age       错
name        对
$name       对
_sex        对
&sex        错
theworld    错
theWorld    对

案例

交换两个变量的值
不使用临时变量，交换两个数值变量的值

数据类型

简单数据类型

Number、String、Boolean、Undefined、Null

Number类

数值字面量：数值的固定值的表示法

110 1024 60.5

进制

十进制默认
十六进制
	var num = 0xA;
八进制
	07 
	012
	2*1 + 1*8
	112
	2*1 + 1*10 + 1*10*10
注意，字面值超过范围，前导值会被忽略，后面的值会当作十进制解析

浮点数

浮点数的精度问题

最高精度时17位小数
不要判断两个浮点数是否相等

数值范围

最小值：Number.MIN_VALUE，这个值为： 5e-324
最大值：Number.MAX_VALUE，这个值为： 1.7976931348623157e+308
无穷大：Infinity
无穷小：-Infinity

数值判断

NaN not a number ,不是数字的number型

NaN与任何都不相等

String类型

‘abc’ “abc”

字符串字面量

‘今天天气真好’
转义符
字符串长度

length属性用来获取字符串的长度
字符串拼接

字符串拼接使用 + 连接

1.两边只要有一个=是字符串，+就实现拼接功能

2.都是数字，就是算数功能

Boolean类型

Boolean字面量： true和false，区分大小写
计算机内部存储：true为1，false为0

Undefined和Null

undefined表示一个声明了没有赋值的变量，变量只声明的时候值默认是undefined
null表示一个空，变量的值如果想为null，必须手动设置

获取变量的类型

typeof

注释

单行注释

用来描述下面一个或多行代码的作用

// 这是一个变量
var name = 'him';

多行注释

用来注释多条代码

/*
var age = 18;
var name = 'zs';
console.log(name, age);
*/

数据类型转换

转换成字符串类型

toString()
String()

存在的意义是，有的属性没有toString方法，这个使用String（）
拼接字符串方式

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

转换成数值类型

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

转换成布尔类型

Boolean()

操作符

运算符 operator

5 + 6

表达式组成操作数和操作符，会有一个结果

算术运算符

+ - * / %

一元运算符

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

前置++

var num1 = 5;
++ num1; 

var num2 = 6;
console.log(num1 + ++ num2);

后置++

var num1 = 5;
num1 ++;    
var num2 = 6 
console.log(num1 + num2 ++);

猜猜看

var a = 1; var b = ++a + ++a; console.log(b);    
	b = 2 + 3= 5
var a = 1; var b = a++ + ++a; console.log(b);   
	b = 1 + 3 = 4
var a = 1; var b = a++ + a++; console.log(b);
  b = 1 + 2 =3
var a = 1; var b = ++a + a++; console.log(b); 
    b = 2 +2 =4

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

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

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

<  >  >=  <= == != === !==

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

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

赋值运算符

= += -= *= /= %=

例如：
var num = 0;
num += 5;	//相当于  num = num + 5;

运算符的优先级

优先级从高到低
	1.()
	2.一元运算符 ++ -- !
	3.算数运算符  先* /  %后 + -
	4.关系运算符 > < >=...
	5.相等运算符    ==  !== === !=
	6.逻辑运算符     先&&   再||
	7.赋值运算符

// 练习1：
4 >= 6 || '人' != '阿凡达' && !(12 * 2 == 144) && true
			true
// 练习2：
var num = 10;
5 == num / 2 && (2 + 2 * num).toString() === '22'
       true                     true

表达式和语句

表达式

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

语句

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

流程控制

程序的三种基本结构

顺序结构

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

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

分支结构

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

循环结构

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

分支结构

if语句

语法结构

if (/* 条件表达式 */) {
  // 执行语句
}

if (/* 条件表达式 */){
  // 成立执行语句
} else {
  // 否则执行语句
}

if (/* 条件1 */){
  // 成立执行语句
} else if (/* 条件2 */){
  // 成立执行语句
} else if (/* 条件3 */){
  // 成立执行语句
} else {
  // 最后默认执行语句
}

案例：
求两个数的最大数
判断一个数是偶数还是奇数
分数转换，把百分制转换成ABCDE <60 E 60-70 D 70-80 C 80-90 B 90 - 100 A

三元运算符

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

案例：
是否年满18岁
从两个数中找最大值

switch语句

语法格式:

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

案例：
显示星期几

素质教育（把分数变成ABCDE）

布尔类型的隐式转换

流程控制语句会把后面的值隐式转换成布尔类型

转换为true   非空字符串  非0数字  true 任何对象
转换成false  空字符串  0  false  null  undefined

// 结果是什么？
var a = !!'123';

循环结构

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

while语句

基本语法：

// 当循环条件为true时，执行循环体，
// 当循环条件为false时，结束循环。
while (循环条件) {
  //循环体
}

案例：
打印100以内 7的倍数
打印100以内所有偶数
打印100以内所有偶数的和

do…while语句

do…while循环和while循环非常像，二者经常可以相互替代，但是do…while的特点是不管条件成不成立，都会执行一次。

基础语法：

do {
  // 循环体;
} while (循环条件);

for语句

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

for循环语法：

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

案例：

continue和break

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

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

案例：

求整数1～100的累加值，但要求碰到个位为3的数则停止累加
求整数1～100的累加值，但要求跳过所有个位为3的数

Study Day09-9.20

Study Day09-9.20 CSS第七天

JavaScript基础

网页、网站和应用程序

JavaScript的强大

JavaScript介绍

JavaScript是什么

JavaScript最初的目的

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

JavaScript和HTML、CSS的区别

JavaScript的组成

ECMAScript - JavaScript的核心 （语法）

BOM - 浏览器对象模型

DOM - 文档对象模型

JavaScript初步学习

JavaScript的书写位置

变量

什么是变量

如何使用变量

变量在内存中的存储

变量的命名规则和规范

案例

数据类型

简单数据类型

Number类

String类型

Boolean类型

Undefined和Null

获取变量的类型

注释

单行注释

多行注释

数据类型转换

转换成字符串类型

转换成数值类型

转换成布尔类型

操作符

算术运算符

一元运算符

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

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

赋值运算符

运算符的优先级

表达式和语句

表达式

语句

流程控制

顺序结构

分支结构

循环结构

分支结构

if语句

三元运算符

switch语句

布尔类型的隐式转换

循环结构

while语句

do…while语句

for语句

continue和break

Study Day09-9.23

Study Day08-9.18

Study Day09-9.20

GCP - Kubernetes study notes

study notes for python

MySql Study Notes

VueJs Study Notes

Redis Study Notes

MySql Study之--MySql日志管理

是一篇对于常见的版本控制软件的特性比较 博客分类： cvs study subversionCVSSVNHTML

ECMAScript - JavaScript的核心（语法）

是一篇对于常见的版本控制软件的特性比较博客分类： cvs study subversionCVSSVNHTML