JavaScript基础

HTML :用来搭建页面的基础框架
CSS ：用来对HTML进行效果渲染
JavaScript:用来定义页面的行为，以及和用户的交互
前端脚本语言

1.JavaScript
网景[NetScape：Navigater]

2.JScript
微软[IE]

3.ECMA
ECMAScript 前端脚本语言的标准规范
ES6.0

4.JavaScript是一门脚本语言
是运行在浏览器中的脚本语言，是由浏览器负责解释执行
轻量级的语言
JavaScript代码直接写在HTML网页中

Java /C 属于编译性语言，写好代码后先编译成机器能识别的代码，再执行
JavaScript属于解释性语言，写好代码后由浏览器负责解释执行，不需要编译

计算机语言
打孔纸带
0101010101

01 开机
001 输入数据
010 输出数据

汇编语言
使用单词表示指令
start 01
input 001
output 010

C/C++ 高级语言
Java/C#

1.JavaScript写在哪里？
在HTML页面的任何地方都可以写JavaScript
只要将代码放到一对标签之间

2.如何学习JavaScript
存储 计算

输入–>存储–>计算–>输出

3.数据的存储
变量和常量

常量

程序运行期间，数值不可改变的量
例如： 100
“newer”

变量

程序运行期间可有变量的量，通常需要使用一个别名表示变量
变量的声明：
通常使用var 或者 let 或者 const来声明变量
var a;
let b;
const c; 声明了不能改变的变量

语法格式

var 变量名;
let 变量名;
const 变量名;

变量名的规则

1.只能用字母，数字,_,$作为变量名的字符
2.不能用数字开头
3.不能使用关键字

用变量来表示数值

var a = 100; 变量a的值是100
var b = “newer”
var c = 12.5

关键字：在一门编程语言中，有特定用法的单词

4.数据类型
JavaScript中的数据类型：

数字类型 number
字符串类型 string
布尔类型 boolean
空类型 null
未定义类型 undefined
独一无二的类型 symbol
对象类型 object

数字类型

包括的整数和小数[浮点数]
浮点数最多可以有16位有效数字，如果超过16位，最后一位数字是不精确的
100 1 2.5

字符串类型

用双引号或者单引号 引起来的数据
“abcd”
“1234”
‘abcd’
‘12345’
‘a’

布尔类型

只有两个值，用来表示逻辑判断
1<2 成立就为 true 又叫做 真
1>2 不成立 为 false 又叫做 假

空类型

当变量的值为null的时候，就为空类型
null表示值不存在

未定义类型

当变量没有值的时候，就是未定义类型
没有明确类型的变量，就是undefined类型
只有一个值：undefined

弱类型变量

在JavaScript中声明变量的时候是不需要明确变量的类型的
在给变量赋值的时候才明确的变量的类型
这种写法，叫做 弱类型变量

可以通过 typeof 关键字 来判断变量的类型
ps:typeof 对一个null类型值进行判断的时候，类型是object 这是JS的一个bug，

5.JavaScript中的运算符

算术运算符
赋值运算符
关系运算符
逻辑运算符
条件运算符

算术运算符：

+  - * /  %
 + - 小学一年级学的
  * / 小学二年级学的

% 取模运算 计算两个数整除之后的余数
20/3=6…2
3.5/2=1…1.5

20%3=2
3.5%2=1.5

赋值运算符

=
+= -= = /= %=
a+=b; 等价于 a=a+b
a-=b; 等价于 a=a-b
a=b; 等价于 a=a*b
a/=b; 等价于 a=a/b
a%=b; 等价于 a=a%b

自加自减运算符

++ –
a++ 等价于 a+=1 等价于 a=a+1
a-- 等价于a-=1 等价于 a=a-1

后置++与前置++

a++ 和 ++a
1.如果a++或者++a单独在一行，使用的时候没有区别
2.如果在一行中有多个任务
a++ 先取值，再++
++a 先++，再取值

关系运算符

关系运算符是用来比较两个数值之间的大小关系的
运算结果一定是boolean值
== ab 如果a等于b，就为true，否则false
=== a=b rug a的值等于b并且a和b的类型也一致，就为true
!=
>
<
>=
<=

逻辑运算符

对boolean值进行运算的运算符
! 逻辑非 非假即真 非真即假
&& 逻辑与 用来连接多个boolean值，如果都为真，才为真，只要有一个为假，就为假
|| 逻辑或 用来连接多个boolean值，如果都为假，才为假，只要有一个为真，就为真
let a=20;
let b=3;
a++ / b= 6.6666666…67;
++a /b = 7;

运算符的优先级：

!
++ –
算术运算符 * / %
+ -
关系运算符
逻辑运算符 && ||
赋值运算符

条件运算符

? :
条件表达式?表达式1:表达式2
条件表达式的结果是boolean值
如果条件表达式为真，就执行表达式1
如果条件表达式为假，就执行表达式2

JavaScript中的对象类型

数字类型 Number
布尔类型 Boolean
字符串类型 String
数组类型 Array

数字类型 Number

构造方法：用来构造数字对象
let a = new Number(100);

方法：对数字进行处理
toFixed(2) 四舍五入保留指定的小数位
toPrecision(2) 保留指定的精度[有效数字]

属性:表示一些特殊的值
MAX_VALUE 最大值
MIN_VALUE 最小值
POSITIVE_INFINITY 无穷大 值为Infinity
NEGATIVE_INFINITY 无穷小 值为-Infinity

NaN 不是数字的数值 (Not a Number)
Infinity 无穷大
-Infinity 无穷小

Boolean对象

let a1 = Boolean(true);
let a2 = Boolean(“abc”);
let a3 = Boolean(“123”);
let a4 = Boolean("")
let a5 = Boolean(null);
let a6 = Boolean(false)
let a7 = Boolean(“false”);
let a8 = Boolean(0);
let a9 = Boolean(Number.NaN);

为假的值：false 空字符串 null 0 NaN
其它都为真：true 非空字符串 非0数字

字符串类型 String
属性

length 获得字符串的长度

方法

charAt(index) 获得指定索引位置的字符
indexOf(str) 获得指定子字符串首次出现的索引位置
lastIndexOf() 获得指定子字符串最后次出现的索引位置
subStr(start,length) 从指定的索引位置，截取length的字符
subString(start,end) 从start开始，到end结束，截取字符串
trim() 去掉字符串首尾的空格
replace(old,new) 替换字符串
split(str) 切割字符串
startWith(str) 判断是不是以str开头
endWith(str) 判断是不是以str结尾
toUpperCase() 转换成大写字母
toLowerCase() 转换成小写字母

JavaScript中的数组对象

数组：用来保存一组数据的类型 一个变量只能表示一个数据

需求：
保存一个同学的成绩
let a=100;
保存多个同学的成绩
使用数组类型

1.数组的定义方式
//定义好之后，数组中的数据个数是确定的
let a = [100,90,95,80,68];
//定义好之后，数组中的数据个数不确定
let b = new Array();
b[0]=100;
b[1]=90;
b[2]=80;
let c = new Array(5);

2.数组的使用

一个数组中是可以存放多个数据的 这些数据叫做数组的元素 每一个元素都有一个编号，这个编号叫做数组的下标[索引]
索引是从0开始的连续的整数 通过索引可以操作数组的任意一个元素

操作方式：
数组变量名[索引]
例如：let a = [100,90,95,80,68];
a[0]表示数组的第一个元素
a[1]表示数组的第二个元素
a[2]表示数组的第三个元素
a[3]表示数组的第四个元素
a[4]表示数组的第五个元素
a[5]不存在,结果是undefined

数组的长度：数组中有多少个元素
数组的最大索引=数组长度-1

JavaScript的数组长度是可以改变的
只要增加了数据，就可以自动增加长度

获得数组长度的方式：
数组名.length

3.数组中的常用方法

push(值) 在数组的末尾添加元素
splice(start,len);从start索引开始，删除len个元素，包含start位置
reverse() 反转数组
sort() 对数组中的元素按照从小到大排序

JavaScript中的流程控制

程序默认会按照代码的编写顺序一行一行依次执行

分支结构：

程序按照一定的条件，有选择的执行某一些代码
if…
if…else…
if…else if…else
switch…case…defalt…

if(条件){
满足条件要执行的代码;
}

if(条件){
满足条件要执行的代码;
}else{
条件不满足要执行的代码;
}

变量的类型是一个数字或者字符串
如果变量的值和某个case的值相等，就从该case开始执行 break是为了结束整个switch

switch(变量){
    case 值:
        break;
    case 值:
        break;
    case 值:
        break;
    default:
        break;
}

循环结构：

程序按照一定的条件，重复的执行某一些代码
for
while
do…while

for循环
for(初始化语句;条件判断语句;条件控制语句){
循环体语句;
}
for的执行流程：
1.先执行初始化语句
2.执行条件判断语句
如果条件为false，循环结束
如果条件为true，继续
3.执行循环体语句
4.执行条件控制语句
5.重复执行2~5这几个步骤

while循环 初始化语句; while(条件判断语句){
循环体语句;
条件控制语句; }

for和while是可以互换的
如果知道循环次数，或者循环的时候需要下标，一般用for 如果不知道循环次数，一般用while

死循环/无限循环

for(;true;){}
for(;1<2;){}
while(true){}
while(1<2){}

break:结束switch for while

使用循环处理数组
let a = [11,22,33,44,55,66,77,88];
for(let i=0;i<a.length;i++){
console.log(a[i]);
}

let var 和const的区别

var 在同一个作用域中,可以重复声明同一个变量
let 在同一个作用域中,不能重复声明，一个变量只能声明一次
const声明了一个不可以修改的变量,并且必须要初始化

变量都是由作用域的
作用域：变量可以使用的范围

函数

函数是一堆代码的集合

定义格式:

//普通函数

function 函数名(){
代码块;
}

//有参数的函数

function 函数名(参数列表){
代码块;
}

//有返回值的函数

function 函数名(参数列表){
…
return 值;
}

函数必须要调用才会执行
调用格式:
函数名();

调用有参数的函数，可以传入对应个数的数值
如果传入的参数个数要函数中定义的个数不一致，也是可以的
函数名(参数值);

如果调用有返回值的函数，可以使用一个变量来接受返回值
let aa = 函数名(参数值);

a+b+c+d+e

JavaScript中的特殊数据类型：
函数类型
function add(a,b){
return a+b;
}
let abc =add;

let aa = add();
-----------------------------------------
let reduce = function(a,b){
return a-b;
}