01-JS概述

JS 概述

JS 是什么？

JS 是 JavaScript 的简称，JavaScricp 是一种运行在客户端（浏览器）中的解释型脚本语言。

JavaScript是一种高级语言，通过JS引擎翻译成计算机可识别的二进制语言。翻译的方式有两种：解释型和编译型。JaveScript属于解释型语言。

解释型：代码从上至下一边解释一边运行。

编译型：一次性编译成可以执行的二进制文件，统一运行。如Java、C

浏览器内核：渲染引擎，JS引擎。

JS 可以做什么？

JS可以用来制作游戏、进行表单验证、书写服务端、可以实现智能检索功能。

JS 和 HTML&CSS 的关系

HTML是用来描述网页结构的。

CSS是用来设置网页样式的。

JavaScript是用来制作动效的。

JS 和 nodejs（服务器端）的关系

JS 历史

1995年，网景公司发明了一款名为 navigator0.9版本的浏览器，但是当时的浏览器不能进行交互动作，不能进行表单验证，网景公司找到布兰登艾奇，用10天时间创造了livescript语言用于表单校验，navigator2.0版本上运用。1996年，微软公司开发JScript应用在explore3.0版本。1997年，网景公司把JavaScript1.0版本捐献给ECMA（欧洲计算机制造商协会）做标准化维护。这套标准被称作ECMAscript标准。

JS 和 H5 关系

狭义上讲，H5指的是HTML的5.0版本，广义上来讲，H5指的是前端的一切开发技术。其中包括HTML、CSS、JavaScript等开发技术。

JS 组成

JS由ECMAscript标准、DOM（文档对象模型）、BOM（浏览器对象模型）组成。

JS 书写位置以及如何运行

JS书写位置有三种：

行内写法 直接在标签内 加上onclick 属性，如

<button onclick='alert(1)'>按钮</button>>

内嵌式：写在HTML结构的底部，为了能够获取页面结构才写到最下面。

<script>
	console.log('abc');
</script>

外链式：通过引入 js 文件，链接外部 js 文件。

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

JS 的注释

对代码的解释说明可以用单行注释或多行注释表示。

单行注释

// 单行注释

多行注释

/*
	多行注释
	多行注释
	多行注释
*/

JS 输入输出语句

提示框输出

alert('警示框');

页面文档输出

document.write('写点啥？');

控制台输出

console.log(10);

提示框

var a = prompt('请输入...');
console.log(a);

变量

变量的概念

变量是存储数据的容器。

变量的定义

先声明，后赋值。

var x; // 声明变量
x=10; // 赋值
console.log(x);

声明的同时赋值。

var y = 20;
console.log(y);

可以同时声明多个变量，再进行赋值。

var x,y,z; // 声明3个变量
x = 10;
y = 20;
z = 30;
console.log(x);
console.log(y);
console.log(z);
console.log(x,y,z);

变量的命名规则

变量是由字母、数字、下划线、美元符号、汉字（不推荐）表示。

var _abc$ = '张三';
console.log(_abc$);
var 班长 ='李张超';
console.log(班长);

不能以数字开头

不能是关键字和保留字

区分大小写

变量的规范

见名识意

驼峰命名法：首字母小写，后边单词首字母大写。

var anBigApple = 90;

JS 数据类型种类

字符串 string

单引号或双引号引起来。

数字 number

数字和字符串是可以进行拼接的。

数值类型：10、20.1、-10、010101（二进制）、0xabef001（十进制）、054（八进制）、NaN

分别是正数、小数、负数、二进制0和1、八进制0-7、十六进制0-9 a-f

NaN：number类型，但不是数字。

NaN的由来：在参与运算的过程中，出现了无法表示数字的时候。

console.log('张'-0)；

未定义 undefined

var x;
console.log(x); // 只声明，未赋值。

空 null

var a = null;
console.log(typeof a); // object

布尔 boolean

console.log(true); // 是真对
console.log(false); // 否假错
console.log(typeof true); // boolean 布尔类型

复杂数据类型

对象 object

JS 数据类型检测

typeof 关键字

console.log(typeof true); // boolean
console.log(typeof 10); // number
console.log(typeof typeof 10); // string

JS 数据类型转换

字符串转为数值类型

Number（）

Number（）可将纯数字的字符串转为数值

Number（）可将非纯数字的字符串转为NaN，也是数值类型

parseInt（）

parseInt（）可以将纯数字的字符串转为数值。

parseInt（）可以将数字开头的字符串转为数字。

parseInt（）可以将非数字开头的字符串转为NaN，也是数值类型。

parseInt（）保留正数

隐式转换

// - * / %

parseFloat（）

保留小数点后的数。

Numeber（）和parseInt（）的不同

parseInt（）可以将数字开头的字符串转换为数字，Number（）只能将纯数字的字符串转换为数字。

parseInt（）和parseFloat（）的不同

parseInt（）将字符串转换为整数

parseFloat（）将字符串转换为小数

JS 数据类型转换字符串

数字转为字符串

num.toString（）

String（num）

JS 数据类型转换布尔

转为boolean类型；

1.Boolean（）

2.！！

var x = '';// 字符串
var y;//undefined
var z = null;
var a = 0;
var b = 'zs'

console.log(Boolean(x));
console.log(Boolean(y));
console.log(Boolean(z));
console.log(Boolean(a));
console.log(Boolean(b));

console.log(!!(x));
console.log(!!(y));
console.log(!!(z));
console.log(!!(a));
console.log(!!(b));

isNaN

判断是否为非数字类型

运算符种类

算术运算符

+ - * / %
+：拼接（字符串和字符串，字符串和数字相加）
+：求和
var x = 2;
var y = 21;
var z = x % y；
console.log(z);// 2

赋值运算符

var a = 10;//将10赋值给a
a = 20;//将a重新赋值为20
a += 20;//等价与a=a+20
a -= 10;//等价于a=a-10
a *= 10;//等价于a=a*10

关系运算符

关系运算符计算出的结果是布尔类型值

>
<
>=
<=
== // 只比较值，不比较类型
!==
=== //既比较值，也比较类型

逻辑运算符

&& 与
|| 或
！ 非

自增自减运算符

a++；在a的基础上加1
++a；在a的基础上加1
区别：单独使用时，都是自身+1
在参与输出，赋值，等操作时候a++和++a是有区别的
1.a++ 先输出a，再自身加1
2.++a 先加1，在输出

运算符的优先级

先乘除，后加减

先括号，后括号外