前端学习JavaScript基础阶段

初识javascript

JavaScript介绍

是一种运行在客户端（浏览器）的编程语言，实现人机交互效果。作用：

网页特效
表单验证
数据交互
服务端编程（node.js)组成：
ECMAScript:规定语法
Web APIs:
- Dom：操作文档
- Bom：操作浏览器

写法：

<-- 行内式 -->
<input type="button" value="三峡大学" οnclick="alert('欢迎你')">
<!-- 内嵌式 -->
<script>alert('Hello')// 单行注释 ctrl+//* 多行注释咋还备案 shift+alt+A */// 输入prompt('请输入年龄');// 输出alert('计算结果');// 控制台输出console.log('控制台打印');
</script>
<!-- 外链式引入 -->
<script src="./试用.js"></script>

变量

变量是计算机存储数据的“容器”，申请空间，存放数据：注意变量指的是容器而不是数据。

变量使用

<script>
// 声明了一个age的变量
var age;
// 赋值
age = 10;//等号是赋值
// 输出结果
console.log(age);
// 变量的初始化
var myname = 'yyh';
console.log(myname);
// 弹出页面显示
var user_name = prompt('请输入你的名字：');
</script>

声明多个变量，逗号隔开

<script>var a=2,b=3,c=4;
</script>

特殊情况：

只申明，不复制：Undefined
不声明，不赋值：报错
不声明，只赋值：允许，成为全局变量

变量命名规则与规范

规则：

不能用关键字
只能用下划线、字母、数字、$组成，且数字不能开头，不能有空格
字母严格区分大小写

规范：

起名要有意义
小驼峰命名法
- 第一个单词首字母小写，后面每个单词首字母大写。例：userName

name不会报错，但是少用；

数据类型

Js变量数据类型是程序运行过程中根据等号右边的值来确定的

Js是动态语言，数据类型可以变化

基本数据类型
引用数据类型
- number 数字型
- string 字符串型
- boolean 布尔型
- undefined 未定义型
- null 空类型

<script>//数字型var p;//不确定var a=4;//数字型var a='ajfh';//字符串型var num = 10;//1.八进制 0·7  前面加0var num1 = 010;console.log(num1);//输出答案是10进制的//2. 十六进制  0·9 a-f  前面加0x// 最大值console.log(Number.MAX_VALUE);//最小值console.log(Number.MIN_VALUE);// 无穷大、小console.log(Number.MAX_VALUE*2);//Infinityconsole.log(-Number.MAX_VALUE*2);//-Infinity// 非数字console.log('yyh'-100);//NaN// 判断非数字console.log(isNaN(12))//Falseconsole.log(isNaN('你好'));//Ture
</script>

引号写法，外双内单，外单内双；

\n换行；\b空格

// 字符串长度
var str = 'My name is yyh'
console.log(str.length);
// 拼接,只要字符串和其他类型拼接，结果是字符串
// 数值相加，字符串相连
console.log('123'+"345");//123345
console.log('我'+13);//我13
console.log(12+12);//24
console.log('12'+12);//1212
// 1.弹出输入框
var age = prompt('输入年龄：');
// 内部处理显示
var str = '你今年已经' + age + '岁了';
// 结果返回给用户
alert(str);
// 未定义变量undifined
var space = null;
console.log(space + '123');//null123
console.log(space+1);//1
// 空值null
var difi = undefined;
console.log(difi + '123');//undifined123
console.log(difi + 123);//NaN,非数字；
// 布尔值true=1;false=0,可以进行加减；

数据类型的检测

var num = 10;
console.log(typeof num);
var timer = null;
console.log(typeof timer);//object 对象

prompt取过来的值是字符型

转换为字符型

var num = 10;

变量.toString()
- var str = num.toString();
利用string()函数，大写
- console.log(String(num));
拼接，加号，隐式转换
- console.log(num+'yyh');

console.log(parseInt(3.94));//3
console.log(parseInt('120px'));//120
console.log(parseInt('adb120px'));//NaN,第一个不是数字，从左往右读
//得到浮点数
console.log(parseFloat('3.14'));//3.14
console.log(parseFloat('120px')); //120
console.log(parseFloat('ere120px')); //NaN
//number
var str = '123';
console.log(Number(str));
console.log(Number('123'));
//算术运算————隐式转换 - / * ,加不行
console.log('12'-5);
console.log('134' - '23');

转换成布尔值

// 空的，否定的转换成False
// 空、0、NaN、null、undefined,只有这五个
console.log(Boolean(''));//false,空
console.log(Boolean(' '));//ture,空格
console.log(Boolean('yfh'));

解释型语言VS编译型语言=java VS javascript

标识符: 变量、属性、函数、参数取的名字（避免关键字或者保留字）
关键字：int float while
保留字：预留的关键字，不能作为变量和方法名 boolean

运算符

简介

operator /操作符用于实现赋值、比较、执行算术运算等功能的符号

算术运算符

console.log(1 + 3); //4
console.log(4 - 7); //-3
console.log(1 * 1); //1
console.log(1 / 1); //1
console.log(4 % 2); //取余 0
console.log(5 % 3); //2
//浮点数,出现精度问题
console.log(0.1 + 0.2); //0.3000000000000004
console.log(0.07 * 100); //7.000000000000001
var num = 0.1 + 0.2;
console.log(num == 0.3); //False

优先级：先乘除后加减，有括号先算括号里面的

递增和递减运算符

前置自增和后置自增独立使用时二者并没有差别！后置自增：先返回原值，后加一

var a = 10;
++a; //表达式是11，a也是11
var b = ++a + 2; //b=14 a=12
var c = 10;
c++; //c++=11 c=11
var d = c++ + 2; //d=13  c=12
var e = 10;
var f = e++ + ++e; //e=11——f=22——e=12

前后置自增的区别

前置：先自增后运算
后置：先运算后自增
自减同理..

比较运算符

//= 赋值
//== 默认转化数据类型，可以比较
//只判断值相等
console.log(18 == '18'); //ture
//不等于
console.log(18 != 18); //False
//全等于 === 值和数据类型完全一致
console.log(18 === '18'); //False

逻辑运算符

&&与 ||或 !非

&& 一假就假
|| 两假才假
！!true=false

//布尔值参与
console.log(3 > 5 || 3 < 2); //False
console.log(!true); //False
//逻辑  中断==短路
//1、与
//如果表达式1结果为真，则返回表达式2
console.log(123 && 456); //456
//如果表达式1为假，则返回表达式1
console.log(0 && 123); //0
console.log(0 && 1 + 2 && 456); //短路，直接返回0
console.log('' && 1 + 2 && 456); //短路，直接返回0
//2、或
//如果表达式1为真返回表达式1
console.log(123 || 234); //123
//如果表达式1为假，一次返回后续表达为真的
console.log(0 || 234 || 456 + 3); //234
//案例
var num = 0;
console.log(123 || num++); //123
console.log(num); //0,后面的没有执行

赋值运算符

//表达式  返回值
//2 = 1+1；
var num = 1+1;
num += 2; //每次自加2
num *= 5; //num=num*5,每次自乘5

将等号右边的值赋予给左边, 要求左边必须是一个容器

运算符优先级

逻辑运算符优先级最低
先算括号
单目优先于双目，全等也最大

流程控制

顺序结构：依次执行
分支结构：根据条件判断执行（if、switch）
循环结构：重复执行一些语句

分支流程控制if

If单分支

//语法结构if (条件表达式) {执行语句;}//满足条件表达式，执行大括号的语句

双分支

//语法结构if (条件表达式) { 执行语句1;} else { 执行语句2;}//满足条件表达式，执行大括号的语句1，否则执行语句2

//1.获取用户输入的值
//2.比较
//3.输出满足条件的
//4.否则输出的语句
var age = prompt('');
if (age >= 18) {alert('去网吧');
} else {alert('作业')
}

案例

//1.弹出输入框
//2.判断是否是闰年
//3.是闰年执行输出
//4.不是闰年执行else
var year = prompt('年份：');
if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {alert('闰年');
} else {alert('平年');
}

多分支

if (条件表达式1) { 执行语句1;} else if (条件表达式2) { 执行语句2;} else if (条件表达式3) { 执行语句3;} else { 执行语句4;} //多选一

三元表达

条件表达式？表达式1：表达式2如果条件表达式为真，执行表达式1，为假执行表达式2；

var num = 10;
var result = num > 5 ? '是的' : '不是的';
console.log(result);

分支流程控制switch

switch：转换、开关；case：小例子、选项；Break：退出；从表达式中找到value，执行相关语句，如果都匹配不上，执行default里面switch (表达式) { case value1: 执行语句1; break; case value2: 执行语句2; break; ... default: 执行最后的语句;}

注意事项：

表达式通常是变量；
表达式和case里的值全等，数值和类型一样；
Break如果当前的case里面没有break则不会退出switch，继续执行下一个case,直到break/break；

区别：

固定值判断用switch,判断范围用if else if;
可以相互替换
switch效率高，If else 从上往下，判断次数多
分支少用if，分支多用switch;

for循环

重复执行某些代码；通常跟计数有关for (初始化变量; 条件表达式; 操作表达式) { //循环体}

初始化变量：用var申明的一个计数器
条件表达式：终止的条件
操作表达式：每次循环最后执行的代码，对计数器进行更新i++

//后置循环
for (var i = 1; i <= 100; i++) {console.log('yyh');
}

执行步骤：

先执行i=1（只执行一次） index
在i<=100判断是否满足条件，如果满足就执行循环体，不满足退出循环
最后执行i++ 递增第一轮结束
第二次循环，继续判断I<=100,如果满足就执行循环体，不满足退出循环,以此循环

双重for循环

for (外层初始化变量; 外层的条件表达式; 外层的操作表达式) { for (里层初始化变量; 里层的条件表达式; 里层的操作表达式) { //执行语句 }}

里层循环是外层循环的循环体；
外层循环一次，里层全部循环；

//99乘法表
var str='';
for(var i=1;i<=9;i++) {for(var j=1;j<=i;j++) {str+=j+'*'+i+'='+i*j;//公式str+='\t';//空格}str=str+'\n';//换行
}
console.log(str);

while循环

while (条件表达式) { //循环体}当条件表达式为正的时候，执行循环体，否则退出循环

var num=1;
while(num<=100) {console.log('yyh');num++;
}

do while循环

先执行一次循环体，再判断条件如果表达式为真，继续执行循环体，否则退出

至少执行一次

var i=1;
do {console.log('yyh');//循环体i++;
} while (i<=100);

continue break区别

continue：退出本次循环，进入下次循环
break：退出整个循环代码规范：函数命名用动词，自变量命名用名词；注释后加空格

数组

创建数组

数组的概念：数组(Array)是一种可以按顺序保存数据的集合创建数组方式：

new方法：arr = new Array();//创建一个名为arr的空数组
利用数组自面量创建数组：

var arr2 = [1,2,3,'yyh','nh'];//0开始
console.log(arr2[3]);//yyh

1.方括号2.声明数组并赋值3.逗号隔开，里面可以放数字，字符串，空值等数组元素4.数组元素类型无限制数组索引从0开始：0.1.2.3...索引方式：或取索引号为3的'yyh'

遍历数组中的元素

用循环把数组中每个元素从头到尾访问一遍,一般会用for循环遍历

var arr3 = ['A','B','C','D'];
for (var i=0;i<4;i++) {console.log(arr3[i]);
}
//索引从0开始i=0;i<4
//输出时i计数器作为索引
var arr=['刘备','关羽','张飞','姜维','诸葛亮','周瑜','曹操','孙权'];
console.log(arr.length);
for (var i=0;i<arr.length;i++) {console.log(arr[i]);
}
//array.length 动态监测数组元素个数

数组中新增元素

通过修改数组长度,empty表示空值
通过修改索引号,原来的数替换,长度不变

//数组中新增元素；依次存入从1开始的100个数
//申明空数组
//计数器，作为数组元素存入
//从1开始，计数器要加1
var arr = [];
for (var i=0;i<100;i++) {arr[i]=i+1;
}
console.log(arr);

//筛选数组大于等于10
//声明新数组，放大于10；遍历；依次追加给新数组
var arr1=[2,3,4,5,6,7,8,8,122,13,1,2,45,67,89,64];
var newArr=[];
var j=0;//newArr的计数器
for (var i=0;i<arr1.length;i++) {if (arr1[i]>=10) {newArr[j]=arr1[i];j++;//存一次加一次}
}
console.log(newArr);

//筛选数组方法2
var arr1=[2,3,4,5,6,7,8,8,122,13,1,2,45,67,89,64];
var newArr=[];//数组长度为0
var j=0;//newArr的计数器
for (var i=0;i<arr1.length;i++) {if (arr1[i]>=10) {newArr[newArr.length]=arr1[i];//新数组初始长度为0，给初始长度索引赋值；}
}
console.log(newArr);

//数组索引反转案例
var arr1=[];
for (var i=arr.length-1;i>=0;i--) {//i--，初始值为长度arr1[arr1.length] = arr[i];
}
console.log(arr1);

数组案例

冒泡排序

冒泡排序是一种简单的排序算法。一次比较两个元素，如果他们的顺序错误就把他们交换过来。走访数列的工作是重复地进行直到不再需要交换，数列已经排序完成。这个算法的名字由来是因为越小的元素会慢慢浮到数列的顶端。

//5,4,3,2,1
//第一轮交换4次；第二轮交换3次；第三轮交换2次；第四轮交换1次
var arr=[5,4,3,2,1];
for (var i=0;i<=arr.length-1;i++) {//外层循环——轮数，长度-1for (var j=0;j<=arr.length-1-i;j++) {//里层控制每轮内交换 arr.length-1-i//前面一个和后面一个相比较if (arr[j]>arr[j+1]) {var temp =arr[0];temp=arr[j];arr[j]=arr[j+1];arr[j+1]=temp;}}
}
console.log(arr);

函数

函数的使用

function ；封装执行特定任务的代码块封装：打包，放在一起便于调用；声明函数：function 函数名(形参1，形参2，形参3...) { //函数体 //形参：形式上的参数，声明要用}

function 声明函数的关键字
函数名一般是动词
函数不调用，自己不执行

调用函数：函数名(实参1，实参2...);//实参实际参数，调用时要用到

函数参数案例

//求两数之间所有数累加和
function getSum1(start,end) {var sum=0;for (var i=start;i<=end;i++) {sum += i;}console.log(sum);
}
getSum1(4,10);

实参个数小于形参个数，结果为NaN，因为形参默认undefined;多了不报错；尽量个数匹配

函数的返回值

只要遇到return,就把结果返回（赋值）给函数调用者；函数名（）= return 后面的结果；function 函数名() { return 需要返回的结果;}函数名();

function getSum(num1,num2) {return num1+num2;
}
console.log(getSum(3,4));

function getMax(num1,num2) {return num1>num2?num1:num2;
}
console.log(getMax(1,2));

//求最大值
function getArray(arr) {var max = arr[0];for (var i = 1; i <= arr.length; i++) {if (arr[i]>max) {max=arr[i];}  }return max;
}
// getArray([2,3,4,5,56,35,24,4,1]);//实参以数组形式输入
var result = getArray([2,3,4,5,56,35,24,4,1]);
console.log(result);

return 最终只能返回一个值（最后一个），用数组可以放多个

function getReult(num1,num2) {return ([num1+num2,num1-num2,num1*num2,num1/num2]);
}
var re=getReult(4,1);
for (var i=0;i<=re.length;i++) {console.log(re[i]);
}
// console.log(re);

函数如果有return,返回return后面的值，如果没有返回undefined

arguments 的使用

arguments 里面存储所有的实参，它以伪数组形式展示伪数组：不是真正的数组

具有数组长度特性
按照索引方式存储
没有真正数组的方法 pop() push()

function fn() {console.log(arguments);console.log(arguments.length);console.log(arguments[2]);//数组的方式遍历argumentfor (var i=0;i<=arguments.length;i++) {console.log(arguments[i]);}
}
fn(1,2,3,4,5);

函数案例

//数组翻转
function reverse(arr) {var newArr=[];for (var i=arr.length-1;i>=0;i--) {newArr[newArr.length] = arr[i];}return newArr;
}
var arr1=reverse([1,2,34,223,42,34]);
console.log(arr1);

//冒泡排序sort
function sort(arr) {for (var i=0;i<=arr.length-1;i++) {for (var j=0;j<=arr.length-1-i;j++) {if (arr[j]<arr[j+1]) {var temp = arr[j];arr[j]=arr[j+1];arr[j+1]=temp;}}}return arr;
}
var arr1=sort([1,2,3,1,2,54,63,2,35,32,4,76]);
console.log(arr1);
var arr2=sort([12,325,1,235,4,3]);
console.log(arr2);

//闰年
function isRunYear(year) {//润年返回ture,不是false;var flag = false;if (year%4==0&&year%100!=0||year%400==0) {flag=true;}return flag;
}
console.log(isRunYear(1245));
//2月天数
function backDay() {var year = prompt('输入年份：');if(isRunYear(year)) {alert('29天');} else {alert('28天');}
}
backDay();

//函数调用另外一个函数
function fn1() {console.log(11);fn2();//fn1调用fn2
}
fn1();
function fn2() {console.log(22);
}

函数的两种声明方式

1.函数关键字命名函数：

function fn() {

console.log('方法一'); }2.函数表达式，匿名函数；

var 变量名 = function() { };
fun是变量名，不是函数；
函数表达式也可以传参；

var fun=function(agd) {console.log('方法二');console.log(agd);
}
fun('尹永红');

作用域

概念：变量在某个范围内起到作用和效果，为了提高程序的可靠性，减少命名冲突；
分类：js作用域（es6）之前；全局作用域局部作用域
- 全局作用域：作用于整个script标签或者js文件内；
- 局部作用域：只在函数内部起作用，又叫函数作用域；

var num=10;//全局作用域
console.log(num);
function fn() {var num = 20;//局部作用域console.log(num);
}
fn();
//10 20

变量的作用域

根据作用域的不同，分为：

全局变量：全局声明
- 函数内部没有声明直接赋值的变量也叫叫全局变量
- 浏览器关闭时销毁，占内存
局部变量：
- 函数内部用Var声明的，只能在函数内部使用；
- 函数形参也是局部变量
- 代码执行完毕销毁，节约内存
块级作用域：{} 内有效
- let定义的变量,只能在块作用域里访问,不能跨块访问,也不能跨函数访问；
- es6有块级作用域

作用域链

概念：内部函数访问外部函数的变量，链式查找决定取那个值方法：采取就近原则的方式来查找变量最终的值（从内到外）

域解析

js引擎运行Js程序：1.预解析：预解析时会把所有的声明（var、function）提升到当前作用域的最前面

变量预解析：变量提升，但不提升赋值
函数预解析：函数提升把函数申明提升到当前作用域的最前面，不调用函数
注意：函数调用必须要在函数声明的下面

2.执行代码：按照代码书写的顺序从上往下执行

f1();
console.log(c);
console.log(b);
console.log(a);
function f1() {var a=b=c=9;console.log(a);console.log(b);console.log(c);
}
//相当于以下执行步骤
function f1() {var a;a=b=c=9;// 相当于 var a=9;b=9;c=9;b和c直接赋值，没有var声明，当作全局变量// 集体声明 var a=9,b=9,c=9;console.log(a);console.log(b);console.log(c);
}
f1();
console.log(c);
console.log(b);
console.log(a);
//输出：9 9 9 9 9 报错;

对象

对象是一个具体的事物，js中对象是一组无序的相关属性和方法的集合。如：字符串、数值、数组、函数。

属性：事物的特征，对象中用名词
方法：事物的行为，对象中用动词

创建对象的三种方法

键值对创建键：属性名值：属性值

1.利用字面量创建对象

//var obj = {};//创建了一个空的对象
var obj = {uname:'yyh',age:22,//逗号隔开sex:'女',//对象的属性sayHi: function() {//对象的方法，可以跟函数console.log('hi~');}
}
//调用对象的属性  两种方法
console.log(obj.uname);
console.log(obj['age']);
//调用对象的方法 sayHi
obj.sayHi();//有函数，调用加括号

变量和属性相同点，都是用来存储数据
- 变量要声明并赋值，可直接使用，单独存在
- 属性在对象里不需要声明，使用：对象.属性
函数和方法都是实现某种功能做某件事
- 函数单独申明并且调用单独存在
- 方法在对象里面调用时：对象.方法()
构造函数和对象：利用构造函数创建对象的过程叫做对象的实例化
- 构造函数：泛指某一大类 class
- 对象：实例特指某一具体事务

2.new Object创建对象

var obj = new Object();//创建一个空对象
obj.uname = 'yyh';
obj.age=22;
obj.sex='女';
obj.sayHi = function () {console.log('hi~');
}
console.log(obj.uname);//调用时一样
console.log(obj['sex']);
obj.sayHi();

3.构造函数创建对象

把对象里面相同的属性和方法抽象出来封装进函数里,前面两种只能创建一个对象

语法格式：function 构造函数名() { this.属性 = 值; this.方法 = function () { }}
调用：new 构造函数名();

function Star(uname,age,sex) {this.uname = uname;this.age = age;this.sex = sex;this.sing = function(sang) {console.log(sang);}
}//调用函数返回对象
var yyh = new Star('李易峰',23,'男');
var dzw = new Star('王俊凯',22,'男');
console.log(typeof yyh);//object
console.log(yyh.uname);
console.log(yyh['sex']);
yyh.sing('剩下的盛夏')
console.log(dzw);
console.log(dzw.age);
console.log(dzw.uname);
dzw.sing('和你在一起');

注意事项：

构造函数首字母大写
不需要return可以返回结果
必须要用new，属性和方法前必须加this
只要new Star调用函数就创建一个对象

new 关键字的执行过程

new 构造函数可以在内存中创建一个空的对象
this 会指向刚才创建的空对象
执行构造函数里面的代码，给这个空对象添加属性和方法
返回这个对象（所以构造函数中不需要return)

遍历的对象属性

for in 遍历对象 for (变量 in 对象) { }

for (var k in obj) {console.log(k);//k 变量 输出的是：属性名console.log(obj[k]);// obj[k] 得到 ： 属性值
}

内置对象

JavaScript 中的对象：

自定义对象 ECMA Script
内置对象：
- JS自带的一些对象，供开发者使用，并提供常用的功能（属性和方
- 如：Math Data Array String等
浏览器对象 JS API

查阅文档：

MDN：
- Math 数学对象不是一个构造函数，不需new来调用，直使用
- 出现非数字格式，NaN
W3C

Math对象

console.log(Math.abs('-1'));//隐式转换
//1.Matn.floor  向下取整
console.log(Math.floor(2,3));//2
console.log(Math.floor(2,9));//2
//2.Math.ceil （天花板） 向上取整
console.log(Math.ceil(2.3));//3
console.log(Math.ceil(2.9));//3
//3.Math.round  四舍五入
console.log(Math.round(2.3));//2
console.log(Math.round(2.9));//3
console.log(Math.round(-2.5));//-2   .5往大取

获取随机数 random()

左闭右开
不跟参数

得到两个数之间的随机整数，包含两个数

 //1.随机 Math.random() 方法//2.猜对为止，需要循环//3.while循环//4.核心算法： if   else if   else判断区间
function getRandom(min, max) {//封装min = Math.ceil(min);//最大值向上取整 max = Math.floor(max);//最小值向下取整return Math.floor(Math.random() * (max - min + 1)) + min; //含最大}var random=getRandom(1,10);while (true) {var num=prompt('猜1-10：');if(num>random) {alert('大了');} else if (num<random) {alert('小了')} else {alert ('对了~');break;}}

日期对象

Date() 日期对象是一个构造函数必须使用new来调用

参数常用写法
- 数字型 2019,10,01
- 字符串型 '2019-10-1 8:8:8'

var date1 = new Date(2022,08,06);
var date2 = new Date('2022-01-02 08:08:08');
console.log(date1);//返回默认格式
console.log(date2);
var date = new Date();//系统时间
//Sun Aug 07 2022 16:26:25 GMT+0800 (中国标准时间)

//格式化日期  年月日
var date = new Date();//调用日期对象并赋值
console.log(date.getFullYear());//当前年
console.log(date.getMonth());//月
console.log(date.getDate());//日
console.log(date.getDay);//星期  周日返回0
//2022年8月6日
var year = date.getFullYear();
var month = date.getMonth() +1;//加一返回当前月
var dates = date.getDate();
var arr = ['日','一','二','三','四','五','六'];
var day = date.getDay();
console.log(year+'年'+month+'月'+dates+'日'+arr[day]);

注意：周日返回的是0；时分秒：

var date = new Date();
console.log(date.getHours());//时
console.log(date.getMinutes());//分
console.log(date.getSeconds());//秒
//封装函数 返回当前 时分秒  00：00：00、
function getTime() {var time = new Date();var hour = time.getHours();hour = hour<10?'0'+hour:hour;var minute = time.getMinutes();minute = minute<10?'0'+minute:minute;var second = time.getSeconds();second = second<10?'0'+second:second;//格式正确return hour+':'+minute+':'+second;//00:00:0  不对
}
console.log(getTime());

获取毫秒数：距离1970年1月1日时间戳

console.log(date.valueOf());
console.log(date.getTime());
//常用写法
var date1= +new Date();//+new Date() 表示返回当前总的毫秒数
//H5新增
console.log(Date.now());

案例——倒计时

//1.倒计时=输入的时间-现在的时间  ，不能直接减
//2.时间戳。 换算为毫秒数转换
//3.剩余时间的毫秒数转换为时间格式
// 天 = parseInt(总秒数/60/60/24);
// 时 = parseInt(总秒数/60/60%24);
// 分 = parseInt(总秒数/60%60);
// 秒 = parseInt(总秒数%60);
function countDown(time) {var nowTime = +new Date();//当前时间var inputTime = +new Date(time);//用户输入时间var times = (inputTime - nowTime)/1000;//times：剩余时间的毫秒数var d = parseInt ( times / 60 / 60 / 24);d=d<10?'0'+d:d;var h = parseInt ( times / 60 / 60 % 24);h=h<10?'0'+h:h;var m = parseInt ( times / 60 % 60);m=m<10?'0'+m:m;var s = parseInt ( times % 60);s=s<10?'0'+s:s;return d+'天'+h+'时'+m+'分'+s+'秒';
}
console.log(countDown('2023-4-1 12:00:00'));

数组对象

案例：

//反转数组
function reverse(arr) {var newArr = [];for (i=arr.length-1;i>=0;i--) {newArr[newArr.length] = arr[i];}return newArr;
}
//修改版反转数组
function reverse(arr) {if(arr instanceof Array) {//(Array.isArray(arr));var newArr = [];for (i=arr.length-1;i>=0;i--) {newArr[newArr.length] = arr[i];}return newArr;} else {return '必须是数组格式！[1,2,3]'}
console.log(reverse([1,2,3,4,5,6]));
console.log(reverse(1,2,3));//输入的不是数组，返回空数组
//再次修改反转数组  精简版
var arr5 = [1,2,3,45,6];
arr5.reverse();
console.log(arr5);

检测是否为数组：

instanceof 运算符

var arr4 = [];
var obj = { };
console.log(arr4 instanceof Array);
console.log(obj instanceof Array);

arr.isArray();// ie9以上支持

console.log(Array.isArray(arr4));
console.log(Array.isArray(obj));

数组元素操作：

添加数组元素返回数组长度
- push 在数组末尾添加元素
- unshift 开头添加

//push 在数组末尾添加元素
var arr = [1,2,3];
arr.push(4,'yyh');
console.log(arr.push(4,5));//返回数组长度
console.log(arr);//返回数组
//unshift 开头添加
arr.unshift(0);//返回数组的长度
console.log(arr);

删除数组元素：均返回被删除的元素；括号里没有元素；删除后数字发生变化；一次只删一个；
- pop()：删除数组的最后一个元素
- shift() 删除最前面的

console.log(arr.pop());//返回最后一个
console.log(arr);
console.log(arr.shift());//返回第一个
console.log(arr);

数组反转：arr5.reverse();
- 参考数组反转
数组排序：arr3.sort();
- 按照位数排序，不准确
- 参考冒泡排序

//盗版版非冒泡排序
var arr3 = [1,2,12,3,41,1];
arr3.sort();//按照位数排序，不准确
console.log(arr3);
//精简版 冒泡排序
var arr4 = [13,23,432,54,2,43];
arr4.sort(function(a,b) {return a-b;//升序排列return b-a;//降序排列
});
console.log(arr1);

返回数组索引号：indexOf（从前往后）lastIndexOf（从后往前）
- 只返回第一个满足条件的索引号
- 如果找不到元素，返回-1

var arr = [1,2,3,4,5,6,1,2,32,43,531,4,3];
console.log(arr.indexOf(3));//2
console.log(arr.lastIndexOf(4));//11

去除重复元素

//遍历旧数组，用旧数组查询新数组，如果元素在新数组中没有，添加该元素，否则不添加
//判断是否存在：  新数组.indexOf(数组元素) 如果返回-1，则新数组里面没有该元素
//封装一个去重的函数
function unique(arr) {var newArr = [];for (var i=0;i<=arr.length-1;i++) {if (newArr.indexOf(arr[i]) === -1) {//如果返回-1，说明在新数组没有newArr.push(arr[i]);//将该数添加到新数组里}}return newArr;
}
var arr1 = unique([1,2,3,2,4,2,42,4,1,54,6,2]);
console.log(arr1);

字符串对象

数组转化成字符串
- arr1.toString()
- arr2.join('&')

var arr1 = [1,2,3,4];
console.log(arr1.toString());//1,2,3,4
var arr2 = [1,2,3];
console.log(arr2.join());//1,2,3
console.log(arr2.join('-'));//1-2-3
console.log(arr2.join('&'));//1&2&3

其他
- concat() 连接两个数组，返回一个新数组
- splice(begin,end) 返回截取去项目的新数组
- splic(从第几个开始，要删除几个数) 返回被删除的新数组影响原数组基本包装类型：把简单数据类型包装为复杂数据类型

// 1.把简单数据类型包装为复杂数据类型
var temp = new String('yyh');
// 2. 赋值给我们申明的字符变量
str = temp;
// 3. 销毁临时变量
temp = null;

JS提供三种特殊引用类型：String、Number 、Boolean；字符串的不可变性：字符串内容改变，其实是地址变了，新开辟了一个内存空间（不要大量拼接字符串），所有方法不会修改字符串本身（另存）

字符串返回位置（参考数组返回）

var str = '改革春分吹暗帝,春天来了';for (var i=1;i<=100;i++) {str+=i;}console.log(str); console.log(str.indexOf('春'));//3console.log(str.indexOf('春',3));//从3的位置开始查找“春”8

//查找O出现的位置
//indexOf返回的不是-1就继续查找（找不到元素）
//一次只能返回一个，所以当前索引加一开始继续查找
var str = 'abcbdbsfgdbsbsfbfdbbbg';
var index = str.indexOf('b');
var num = 0;
// console.log(index);
while (index !== -1) {console.log(index);num++;index = str.indexOf('b',index + 1);//当前索引号加一
}
console.log('b出现的次数' + num);

根据位置返回字符
- charAt(index)
- charCodeAt(index) 返回Ascll码判断按键
- str[index] H5新增

var str = 'yyh';
console.log(str.charAt(2));//h
//遍历所有字符
for (var i=0;i<str.length;i++) {console.log(str.charAt(i));
}
console.log(str.charCodeAt(0));// y 121(码)
console.log(str[1]);//y

判断对象里面是否有该属性：对象名[属性名]

案例--统计出现最多的字符次数

// 用CharAt遍历整个字符串
//把每个字符追加给对象，对象已存在+1
//遍历对象，得到最大值和该字符
var str = 'vbxvzzvbzbcbzvbc';
var o = {};
for (var i=9;i<str.length;i++) {//遍历字符var chars = str.charAt(i);//chars是每个字符串里面的每一个字符if (o[chars]) {//如果对象里面的字符存在o[chars]++;//该字符个数加一} else {//如果对象里面的字符不存在o[chars] = 1;//该字符个数等于1}
}
console.log(o);//{b: 3, c: 2, z: 1, v: 1}
//遍历对象
var max = 0;
for (var k in o) {//k 得到的是 属性名//o[k] 得到属性值if (o[k]>max) {max = o[k];ch = k;}
}
console.log(max);
console.log(ch);

拼接字符串 concat(str1,str2,str3...)
截取字符串 substr('起始位置'，'取几个字符)
替换字符串 replace(a,b)a替换为b 只替换第一个字符
字符转化为数组 split('分隔符') join：数组转化为字符串
toUpperCase() //转换大写
toLowerCase() //转换小写

//1.拼接字符串  concat(str1,str2,str3...)
var str = 'andt';
console.log(str.concat('red'));//andtred
//2.截取字符串 substr('起始位置'，'取几个字符)
var str1 = 'adsbdfsgn';
console.log(str1.substr(2,4));//从索引号2开始取4个//3.替换字符串 replace(a,b)a替换为b  只替换第一个字符
var str2 = 'yyh';
// console.log(str.replace('y','d'));//dyh
//替换全部  循环
while (str2.indexOf('y') !==-1 ) {//判读是字符Y时str2 = str2.replace('y','*');//把y替换成星号
}
console.log(str2);//**h
//4.字符转化为数组 split('分隔符')  join：数组转化为字符串
var str3 = 'y,y,y';
console.log(str3.spilt(','));//[y,y,h]
//连在一起看作一个数组元素

数据类型

简单数据类型
- 存放在‘栈’ ，存放的是值
- var age = 22;
复杂数据类型
- var arr = [1,2,3]
- 先在栈里面存放地址，用地址指向堆里面的数据

简单数据类型

（基本数据类型、值类型）在存储时变量中存储值本身——栈string,number,boolean,undefined,null (五大数据类型)null特殊，返回的是空的对象：如果有变量打算存储为对象，但是暂时没有元素，就存储为null值传参：

function fn(a) {a++;console.log(a);
}
var x=10;
fn(x);//调用函数打印的x实际上是a,x本身的值没有变，输出11
console.log(x);//输出10

复杂数据类型

（引用类型）在存储时存储的仅仅是地址 ——堆（和栈存储互不干扰）通过new关键字创建的对象（系统对象，自定义对象）如：Object.Array.Date等；复杂数据类型传参时，通过地址指向堆里的同一个数据，会引起值变化