CXYVIP官网源码交易平台_网站源码_商城源码_小程序源码平台-丞旭猿论坛
CXYVIP官网源码交易平台_网站源码_商城源码_小程序源码平台-丞旭猿论坛
CXYVIP官网源码交易平台_网站源码_商城源码_小程序源码平台-丞旭猿论坛

javascipt基础-免费源码丞旭猿

一.计算机基础知识

1.编程语言

​ 机器语言: 0 1

​ 汇编语言: %&&

​ 高级语言: Java python c c++ c go php javascript,node andriod objective-c swift

注意点: html css 不是编程语言 标记语言

2.计算机组成

​ 硬件:显示器,…. 硬盘 内存

​ 硬盘:可以永久存储数据

​ 内存: 数据计算空间(容器)

软件: 操作系统(windows macOS Linux andriod ios)-> 应用软件(qq,云音乐….)

存储单位: 1G = 1024M 1m= 1024K 1k= 1024B

二.javascript入门

1.概念

​ javascript是一门运行在’客户端‘,面向对象的 ,事件驱动的,单线程的 编程语言。

2.js的作用

  • 表单动态校验(密码强度检测) ( JS 产生最初的目的 )
  • 网页特效(webAPI)
  • 服务端开发(Node.js)
  • 桌面程序(Electron)
  • App(flutter)
  • 控制硬件-物联网(Ruff)
  • 游戏开发(cocos2d-js)

网站开发:vue.js 微信小程序 react.js

3.js代码是怎么执行

浏览器内核分为两部分:渲染引擎 解析引擎

渲染引擎:解析html css

解析引擎: 解析javascript

4.js的组成

分为三部分:ECMAScript 与 DOM,BOM

1.ECMAScript(欧州机算机标准协会): 制定js的语法规范

2.DOM与BOM: 可以做浏览器上网页特效(webAPI)

了解一下原生javasript有哪些: js基础语法,webAPI, js高级,ajax

5.js代码的书写位置

1.行内式(一般不会写行内式的js,了解即可)

<divonclick="alert(123)">点我</div>     //当点击时触发点击事件

2.内嵌式

<script>这里写js代码</script>

3.外联式

<scriptsrc=xxx.js>不要在这里写js代码</script>

6.js中的注释

1.内行注释 ctrl + /

2.多行注释

7.js的常见的输入方式

alert(‘xxx’) 警式框

console.log(xxxx) 控制台语句

prompt(‘请输入你的信息’) 输入框

confirm(‘你确定要删除码’) 确定选择框

三.js基础

编程的三要素:数据 流程控制 函数

“xiaosa” 18

1.数据

1.1变量

作用

是一个存放数据的空间 , 这个空间只能存放一个数据

变量的使用

// 变量分为两个部分:   变量名   变量值// 1.声明变量名 var === variablevarage;// 2.赋值age=18;// 重点:一般连起来写varage=18

变量的语法注意点

//1.变量是可以更新的varmyname="jack"myname="rose"console.log(myname)//rose//2.一次可以声明多个变量varmyname=tom,age=4,gender="公";console.log(myname,age,gender)//3.变量只声明不赋值 结果为undefinedvargenderconsole.log(gender)//undefined//4.变量不声明直接打印会报错,除了name和一些特殊的名字console.log(tel)//报错 age is not defined

变量名的定义规范

| 规则 | | ———————————————————— | | 由字母(A-Za-z)、数字(0-9)、下划线(_)、美元符号( $ )组成,如:usrAge, num01, _name | | 严格区分大小写。var app; 和 var App; 是两个变量 | | 不能 以数字开头。 18age 是错误的 | | 不能 是关键字、保留字。例如:var、for、while | | 变量名必须有意义。 MMD BBD nl → age |

重点案例练习:两个变量交换数据

// 两个变量相互交换数据vara=10;varb=100;vartemp;temp=a;a=bb=temp;console.log(a,b);//  100   10

1.2 数据类型–重点

在javascript中数据分为两大类,8小类

1.基本数据类型(值类型): 数值型Number 字符串型String 布尔型Boolean 未定义型undefined 空型Null

2.复杂数据类型(引用类型): 对象型Object 数组Array(但是数组也是对象) 函数型 function(){}(但是函数也是对象)

变量的数据类型是由变量的值决定的,它是可变的

数值型Number

vara=100varb=99.8;varc=-10;

进制问题:二进制 八进制 十进制 十六进制

八进制 :数字以0开头

十六进制:数字以0x开头

最大值:Number.MAX_VALUE

最小值:Number.MIN_VALUE

无穷大:Infinity

无穷小:-Infinity

(重点)非数字:NaN (not a number) 不是一个数字 (当一个数据向数值类型转换时,转换不过去,就是NaN)

isNaN函数

//isNaN()   判断  是否 不是一个数字console.log(isNaN(100))//falseconsolo.log(isNaN(jack))//true

字符串型String

概述:用单引号或双引号包裹起来的数据就是字符串类型,es6还可以用反引号“来包裹

varstr="我是一个字符串"varstr=123varstr=`abc`//反引号可以写变量${变量名}

字符串嵌套

varstr=我是一个"字符串"varstr="我是一个\"字符串\""

转义字符:

| 转义符 | 解释说明 |

| —— | ——————————— |

| \n | 换行符,n 是 newline 的意思 |

| \ \ | 斜杠 \ |

| \ | 单引号 |

| \” | 双引号 |

| \t | tab 缩进 |

| \b | 空格 ,b 是 blank 的意思 |

字符串的长度length (重点)

varstr="我是武汉传智播客的老师"console.log(str.length)//11

字符串的拼接 +

口决:数值相加,字符相连

varstr="我是"+"老师"//我是老师"varstr="pink"+10//"pink10"//左右两边只要有一个字符串就是拼接

字符串拼接加强

建议大家用 反引号`+${变量}`这种写法

varage=18varstr="我今年"+age+"岁"//"我今年18岁"    不要用这种写法varstr=`我今年${age}岁`//"我今年18岁"    用这种写法

布尔型Boolean

只有两个值 true false

varflag=truevarflag=false

未定义型undefined

varun=undefined// 这个变量有值 但是不知道数据类型

空型Null

varnl=null//这个变量的值是空的

数据类型检测 typeof 或 typeof()

console.log(typeof10);//numberconsole.log(typeof(10));//numberconsole.log(typeofabc);//stringconsole.log(typeof(abc));//stringconsole.log(typeoftrue);//booleanconsole.log(typeof(false));//booleanconsole.log(typeofundefined)//undefinedconsole.log(typeofnull)//object

字面量:

概念:从表面就可以看出这个数据是什么类型

8,"string"true[]{}function(){}

1.3数据类型之间的相互转换

a.基它类型转换为字符串型

1.toString()

varnum=10console.log(num.toString())//10varflag=trueconsole.log(flag.toString())//true

2.String()

varnum=10console.log(String(num))//10varflag=trueconsole.log(String(flag))//true

3.加上空字符串 + ‘’

varnum=10console.log(num+)//10varflag=trueconsole.log(flag+)//true

b.其它类型转换为数值型

parseInt (parse integer)

varstr="520肖战"console.log(parseInt(str))//520varstr="宋祖儿5201314"console.log(parseInt(str))//NaN

parseFloat(parse float)

varstr="520.1314肖战"console.log(parseFloat(str))//520.1314varstr="宋祖儿520.1314"console.log(parseFloat(str))//NaN

Number

varstr=100console.log(Number(str))//100

隐式转换 – * /

console.log(123-0)//123console.log(123*1)//123console.log(123/1)//123

c.其它类型转换为布尔型

Boolean()这个函数转换为布尔型但是我们一般不用写因为有隐式转换哪此值代表false呢,0,NaN,undefined,null这些值在隐匿转换中都表示假false

1.4运算符

a.算术运算符

加+ 减- 乘* 除/ 取余% 自增 ++ 自减 —

//自增运算符  自身值加1// 注意点:变量++    var num=10    num++varnum=10num++//  11++num//  11//总结:前置自增与后置自增 单独是一行,没有区别,都是自身变量+1//1.前置自增:先自增,再返回,++num//2.后置自增 : 先返回,再自增num++

b.比较运算符

大于: >

小于:<

大于等于: >=

小于等于: <=

等于:== (值相等,数据类型有可能不一致)

console.log(10==10)//true

不等于: !=

全等于:=== (值相等,数据类型也要一致)

console.log(10===10)//false

不全等于: !== (只要是值不相等或类型不相等,结果为真true)

console.log(10!==11);//trueconsole.log(10!==10);//trueconsole.log(10!=10);//false

c.逻辑运算符

非:! 取反

console.log(!true)//falseconsole.log(!false)//true

与:&& 两边都为真,结果为真

或:|| 只要有一个为真,结果为真

重点:短路运算 逻辑中断

逻辑与中断只要是碰到假就会中断consoloe.log(123&&0&&456)//0逻辑或中断只是是碰到真就会中断consoloe.log(123||0||456)//123案例varnum=10;console.log(123&&&&num++)//console.log(num)//10

d.赋值运算符

赋值:= += -= *= /= %=

vara=10;a+="10"//a = a+"10"a++console.log(a);// 1010

e.三元运算符(三目运算符)

语法:

结果 = 条件表达式 ? 表达式1 : 表达式2

当条件表达式为真时,结果是表达式1的值。当条件表达式为假时,结果是表达式2的值

//案例: 求两个数的最大值vara=3varb=10varres=a>b?a:b//经典面试题:用一行代码实现求三个数的最大值vara=100varb=30varc=10varres=a>b?(a>c?a:c):(b>c?b:c)

二.流程控制

数据+流程控制 = 算法

分类:顺序 分支 循环

1.顺序 不用学

2.分支:

2.1单分支

//语法if(条件表达式=>boolean){...业务逻辑代码}// 当单分支的业务逻辑代码只有一行时,{}可以省略//案例varyear=3if(year>=1){console.log("有年终奖")}console.log("加油,好好干")

2.2双分支

//语法if(条件表达式=>boolean){如果为真...执行业务逻辑代码1}else{如果为假...执行业务逻辑代码2}//案例:判断是否是闰年//算法: 年份能被4整除但不能被100整除 或  年份能被400整除varyear=prompt(请输入年份)if(year%4==0&&year%100!=0||year%400==0){console.log("闰年")}else{console.log(平年)}

2.3多分支

//语法if(条件表达式=>boolean){如果为真...执行业务逻辑代码1}elseif(条件表达式){如果为假...执行业务逻辑代码2}elseif(条件表达式){...}...else{...}

2.4switch case

语法:

​ switch(条件表达式){

​ case value1:

​ 表达式1;

​ break

​ case value2:

​ 表达式2;

​ break

​ …

​ default:

​ 表达式

​ break

}

注意事项:1.case后面的break不能丢,除了default外 2.条件表达式的值与case后的value必须 全等

//用switch case方式打印学生的成绩   大于90 优秀   大于80 良好  大于70 一般    大于60及格    小于60  不及格varscore=prompt(请输入学生成绩);vardata=parseInt(score/10)switch(data){case10:console.log("棒棒哒");breakcase9:console.log("优秀");breakcase8:console.log("良好");breakcase7:console.log("一般");breakcase6:console.log("及格");break;default:console.log("不及格");}

总结:多分支一般用来处理 范围 的业务逻辑,switch case处理 定值 的业务逻辑

3.循环

作用:重复的执行代码

3.1 for 一般跟 计数 相关

语法:

for(初始化变量;条件表达式;操作表达式){

​ …循环业务代码

}

执行顺序:

​ 初始化->条件表达式->循环体->操作表达式

​ 条件表达式(真)->循环体->操作表达式

​ 条件表达式(假)->循环结束

//案例for(vari=1;i<=3;i++){console.log(i);//1 2 3}console.log(i);// 4   全局变量//案例   求1~3的和varsum=0for(vari=1;i<=3;i++){sum=sum+i}console.log(sum)//求1~100之间所有数的平均值varsum=0;varaverage=0;for(vari=1;i<=100;i++){sum+=i;}average=sum/100;console.log(average)//求1~100之间偶数与奇数的和vareven=0;varodd=0;for(vari=1;i<=100;i++){if(i%2==0){even+=i}else{odd+=i}}console.log(`偶数和为${even}`)console.log(`奇数和为${odd}`)//求1~100之间能被3整除的和varres=0;for(vari=1;i<=100;i++){if(i%3==0){res+=i}}console.log(res)//循环字符串拼接varstr=;for(vari=1;i<=5;i++){str+=}console.log(str)

双重for循环

语法:

​ for (外层的初始化变量; 外层的条件表达式; 外层的操作表达式) {

​ for (里层的初始化变量; 里层的条件表达式; 里层的操作表达式) {

​ // 执行语句;

​ }

​ }

//案例://打印五行五列的小星星varstr=""for(vari=1;i<=5;i++){//行for(varj=1;j<=5;j++){//列str=str+"☆"}str+=\n}console.log(str);//打印10行的倒三角形// 算法1:varstr=""for(vari=1;i<=10;i++){for(varj=1;j<=10-i+1;j++){str+="☆"}str+="\n"}console.log(str);// 算法2:varstr=""for(vari=10;i>=1;i--){for(varj=1;j<=i;j++){str+="☆"}str+="\n"}console.log(str);//打印 九九乘法表varstr=""for(vari=1;i<=9;i++){for(varj=1;j<=i;j++){str+=`${j}×${i}=${j*i}\t`}str+=\n}console.log(str);

3.2 while

语法:

while(条件表达式){

​ 循环体

}

注意点:在循环体中要有修改条件表达式的操作,否则就可以成为死循环了

//案例 求1~100所有整数的和varsum=0varj=1;while(j<=100){sum+=jj++}console.log(sum)//案例:弹出一个提示框,你爱我吗?如果输入我爱你,就提示结束,否则一直弹varmessage=prompt(你爱我吗)while(message!==我爱你){message=prompt(你爱我吗)}alert("我也爱你")

3.3 do…while

语法:

do {

​ 循环体

} while(条件表达式)

注意点:在循环体中要有修改条件表达式的操作,否则就可以成为死循环了。do至少会执行一次

//案例do{varmessage=prompt(你爱我吗)}while(message!==我爱你)alert(我也爱你)

3.4.循环中的两个关键词 break 与continue

break: 中断所有循环

continue:中断本次循环,跳到下一个循环

//案例:吃包子出现虫子for(vari=1;i<=5;i++){if(i==2){// 第二个出现虫子,扔掉第二个,接着吃continue;}if(i==4){// 第四个出现虫子,扔掉,不再吃包子了break;}console.log(`我正在吃第${i}个包子`);}

循环ATM机作业题

varmoney=100;do{varoperation=prompt("请输入您要的操作\n 1.存钱 \n 2.取钱 \n 3.显示余额 \n 4.退出");if(operation===1){varm=prompt("请输入你要存的钱数")money+=parseInt(m)alert(你的余额为:+money)}elseif(operation===2){varm=prompt("请输入你要取的钱数")money-=parseInt(m)alert(你的余额为:+money)}elseif(operation===3){alert(你的余额为:+money)}elseif(operation===4){varflag=confirm(你确定要退出吗)if(!flag){operation=null}}else{alert(请输入正确的操作数字)}}while(operation!==4)

三.数组

1.概念

数据的有序集合,可以用来存储多个数据

2.创建的两种方式

1.构造函数方式:var arr = new Array()

vararr=newArray();//创建了一个空的数组console.log(arr);// []

2.字面量

vararr=[1,string,true,undefined,null,[],{},function(){}]//数组中的成员(元素)可以是任意的数据类型

数组的索引(下标):从 0 开始

数组的的元素的访问

vararr=[胖虎,静香,大雄]console.log(arr[2])//大雄

3.数组长度

​ arr.length

4.遍历

vararr=[胖虎,静香,大雄]for(vari=0;i<arr.length;i++){console.log(arr[i])}// 扩展arr.forEach(function(value,index){console.log(value,index);})

5.案例

//1.求数组中的最大值vararr=[1,2,3,9,5,7]varmax=arr[0];for(vari=1;i<arr.length;i++){if(arr[i]>max){max=arr[i]}}console.log(max)//数组中存放10个整数(1~10)vararr=[]for(vari=1;i<=10;i++){arr[i-1]=i}console.log(arr)//数组筛选 将大于5的值筛选出来//方案1vararr=[1,2,5,3,4,6,9]varnewArr=[]varj=0//j的作用相当于一个计数器for(vari=0;i<arr.length;i++){if(arr[i]>=5){newArr[j]=arr[i]j++}}console.log(newArr)//方案2vararr=[1,2,5,3,4,6,9]varnewArr=[]//利用了newArr.length的长度是动态的特性for(vari=0;i<arr.length;i++){if(arr[i]>=5){newArr[newArr.length]=arr[i]}}console.log(newArr)// 求数组中出现次数最多的元素及它的次数vararr=[1,2,3,a,"b",2,"c","a","d","a"]//数组的反转//方案1vararr=[胖虎,静香,大雄,小夫]varnewArr=[];for(vari=0;i<arr.length;i++){newArr[arr.length-i-1]=arr[i]}console.log(newArr);//方案2vararr=[胖虎,静香,大雄,小夫]varnewArr=[];for(vari=arr.length-1;i>=0;i--){newArr[newArr.length]=arr[i]}console.log(newArr);//数组的冒泡排序从小到大vararr=[9,2,17,8,5,3]// =>[2,3,5,8,9,17]for(varj=0;j<arr.length-1;j++){//外层控制是趟数 行for(vari=0;i<arr.length-1-j;i++){if(arr[i]>arr[i+1]){vartemp=arr[i]arr[i]=arr[i+1]arr[i+1]=temp}}}

四.函数

1.概念

将相同的业务逻辑封装起来,重复使用

2.语法

从现实中理解函数的使用:函数声明相当于是 ’做榨汁机‘,函数调用相当于是 ’使用榨法机‘。

分为两部分: 函数的声明 函数的调用

函数声明:

function 函数名 ([形参列表]) {

​ 函数体

​ [return 返回值]

}

函数调用

​ 函数名 ([实参列表])

//案例functiongetSum(){//函数声明varsum=0for(vari=1;i<=100;i++){sum+=i}console.log(sum)}getSum()//函数调用

3.形参与实参

functiongetSum(a,b){//a,b是形参console.log(a+b)}getSum(1,2)// 1,2是实参//形参与实参的个数不匹配的情况functiongetSum(a,b){console.log(a+b)}getSum(1,2)//形参与实参个数一至getSum(1,2,3)//把3传给函数,但是在函数中没有形参来接收,就不接收getSum(4)//相当于b接收是undefined

4.返回值

函数可以有返回值,也可以没有返回值,根据业务逻辑

functionfoo(name){returnname+",我爱你"// return 返回值}varres=foo("学姐")console.log(res)

注意事项:

1.return 可以终止函数的执行,return后面可以不跟 数据

2.如果函数没有return 默认返回就是undefined

5.函数小案例

//利用函数求两个数的最大值functiongetMax(a,b){// if(a>b){//     return a;// }else {//     return b// }returna>b?a:b;}varres=getMax(4,6)console.log(res);//利用函数求三个数的最大值functiongetMax(a,b,c){// if(a>b){//     //a大于b//     if(a>c){//         return a//     }else {//         return c//     }// }else {//     //b大于a//     if(b>c){//         return b//     }else {//         return c//     }// }returna>b?(a>c?a:c):(b>c?b:c)}varres=getMax(19,10,3)console.log(res);

6.arguments的使用

1.在任意函数内部都有一个看不见的arguments,除了箭头函数外

2.arguments是一个长的像数组的伪数组,可以对它进行遍历

3.函数调用的实参变成了arguments的元素

functiongetSum(){varsum=0// arguments = [[1,2,3]]   [[2,3,9,4,5]]for(vari=0;i<arguments.length;i++){sum+=arguments[i]}returnsum}varres1=getSum(1,2,3)console.log(res1);//6varres2=getSum(2,3,9,4,5)console.log(res2);//23

7.函数声明的两种形式

a.声明式

functionfn(){console.log("我是声明式的函数")}fn()

b.表达式式(匿名式) 函数也是一种数据类型

varfn=function(){console.log("我是表达式式的函数")}fn()

8.作用域

概念:代码(变量)起作用效果的区间范围

分类:全局作用域 局部作用域

重点:es6之前只有函数的{}才有限定作用域

<script>vara=10;//全局functionfn(){varb=20//局部}if(true){varc=30//全局}while(true){vard=40//全局的}</script>

9.全局变量与局部变量

全局变量:变量声明在全局作用域下

局部变量:变量声明在函数内部

注意点:在函数内部变量没有声明,直接赋值,就是全局变量(这句话在一定的条件下有问题)

10.变量的生命周期

变量的生命周期指的是变量从什么时候开始创建,么时候销毁。

全局变量的生命周期:

​ 生:代码开始运行

​ 死:关闭浏览器当前的窗口

局部变量的生命周期:

​ 生:函数开始调用时

​ 死:调用函数完毕时 (将来学习闭包时这句话又要注意)

11.作用域链

函数内部是可以套函数的,因此函数内部形成了作用域链

重点:函数内部的变量如果没有找到,就向上一层查找,上一层出没有,再向上一层查找,因为形成了一条查找的链条。

做题时的原则:就近原则

functionfn1(){//   0级链    有函数 fn1vara=1functionfn2(){//   1级链    有a=1 与函数 fn2varb=2functionfn3(){//2级链       有b=2  与函数 fn3varc=3console.log(c)//3级链    有c = 3}fn3()}fn2()}fn1()

五.对象

1.概念

现实生活:对象就是东西,是一个具体的事物。万物皆对象

程序角度: 对象是一组无序的数据的集合。包含属性方法

2.对象的创建

方式1:字面量

varperson={name:"jack",age:18,sex:,showFilm:function(){console.log("I can showFilm");},liaoMei:function(){return"I can liaoMei"}}//属性输入打印console.log(person.name);//jack//关联数组的写法console.log(person[age]);//18//如果属性不加引号就是变量名vargender=sexconsole.log(person[gender]);//男//方法调用person.showFilm()//方法调用关联数组写法varres=person[liaoMei]()console.log(res)

方式2: new Object()

varobj=newObject()//相当于创建了一个空的对象   var obj = {}//对象的动态特性obj.name="项思醒";obj.age=21;obj.type="女海王"obj.dance=function(){console.log("I can dance")}// 属性输入console.log(obj.name)console.log(obj[type])// 方法调用obj.dance()obj[dance]()

方式3: 构造函数

以上的两种方式都只能创建一个对象,如何多次创建对象呢?批量的生产对象

工厂函数:

functionperson(name,age,gender){varobj={};obj.name=name;obj.age=age;obj.gender=gender;returnobj}varp1=person(jack,18,"男")console.log(p1);varp2=person(rose,21,"女")console.log(p2);

构造函数:

functionMario(name,color,height){//模板  模具   类classthis.name=namethis.color=colorthis.height=heightthis.smallJump=function(){console.log("smallJupm");}this.bigJump=function(){console.log("bigJupm");}this.attack=function(){console.log("attack");}}varm1=newMario("redMario",red,"100cm")// new构造函数的过程也叫   实例化console.log(m1);varm2=newMario("greenMario",green,"100cm")console.log(m2);//m1,m2可以称为实例

构造函数的注意事项:

1.构造函数的函数首字母一般建议大写

2.构造函数的返回值如果没有写return 默认返回this

3.构造函数调用时前面要用关键词 new

new关键词执行的过程

1.在内存中开辟了一个空间

2.this变量指向了这个空间

3.进入函数体执行代码

4.有一个看不见的return this

3.对象的遍历 for…in

varobj={name:"jack",age:18,gender:"male",fn:function(){}}for(varkinobj){console.log(k)console.log(obj[k])console.log(k,obj[key]);}

六.内置对象

学习内置对象: Math 数学 Date 日期 String字符串 Array 数组

怎么学:多写,多记方法名,后期多练

Math 数学

属性:Math.PI

方法:

//1.最大值Math.max(1,2,4,9)//9//Math.max() 不能求数组的最大值Math.max([3,65,76,2,9])//NaN//求数组的最大值解决方案,后期学Math.max.apply(null,[3,65,76,2,9])//76Math.max(...[3,65,76,2,9])//76//2.求绝对值Math.abs(-1)//1Math.abs(1)//1//3.向下取整Math.floor(1.3)//1Math.floor(1.9)//1//4.向上取整Math.ceil(1.2)//2Math.ceil(1.9)//2//5.四舍五入Math.round(1.1)//1Math.round(1.8)//2Math.round(-1.1)//1Math.round(-1.5)//1   负数时,  .5往大了取整//6.取随机数  [0,1)   从0到1,包括0,不包括1Math.random()//获取两个数之间的整数,包括两个整数的算法Math.floor(Math.random()*(max-min+1))+min;//含最大值,含最小值

Date 日期

vardate=newDate()//获取当天时间对象vardate=newDate(2021-4-17)//取参数时间对象//date不好用date.getFullYear()//年date.getMonth()+1//月份    注意date.getMonth()要加1才能得到正确的月份date.getDate()//日期date.getDay()//星期几   注意date.getDay()得到的值是[0-6]  星期日是0date.getHours()//时date.getMinutes()//分date.getSeconds()//秒

时间戳:

解释:从1970年1月1日 到 一个时间点 经过了多少毫秒

//方式1:valueOf  getTimevardate=newDate()//从1970年1月1日 到 现在 经过了多少毫秒cosole.log(date.valueOf())console.log(date.getTime())//方式2: +new Datevardate=+newDate(2000-01-01)//从1970年1月1日 到 2000-01-01 经过了多少毫秒console.log(date)//方式3: Date.now()   //从1970年1月1日 到 现在 经过了多少毫秒vardate=Date.now()console.log(date)//案例:计算从你出生到现在活了多少天?varnowTime=Date.now()varbirthTime=+newDate(2001-3-20)vartime=Math.ceil((nowTime-birthTime)/1000/60/60/24)console.log(time);//案例:倒计时效果functioncountDown(time){varnowTime=+newDate();// 返回的是当前时间总的毫秒数varinputTime=+newDate(time);// 返回的是用户输入未来时间的总毫秒数vartimes=(inputTime-nowTime)/1000;// times是剩余时间总的秒数vard=parseInt(times/60/60/24);// 天varh=parseInt(times/60/60%24);//时varm=parseInt(times/60%60);// 分vars=parseInt(times%60);// 当前的秒returnd++h++m++s+;}

Array数组

1.数组类型检测

vararr=[1,2,3]console.log(typeofarr);//object//arr 是否是 Array的实例vararr=newArray()console.log(arrinstanceofArray);//trueconsole.log(Array.isArray(arr));//true

2.数组元素的添加与删除

//push  在数组的后面添加元素1.修改了原数组2.参数追加的元素2.返回值是追加后数组的长度vararr=[1,2,3]arr.push(4,5)//返回值是5   原数组变成了[1,2,3,4,5]arr.push([4,5])//返回值是4   原数组变成了[1,2,3,[4,5]]//unshift  在数组的前面追加元素1.修改了原数组2.参数追加的元素2.返回值是追加后数组的长度vararr=[1,2,3]arr.unshift(4,5)//返回值是5   原数组变成了[4,5,1,2,3]//pop  删除数组的最后一个元素1.修改了原数组2.参数2.返回值删除的那个元素vararr=[1,2,3]arr.pop()//返回值是3   原数组变成了[1,2]//shift 删除数组的第一个元素1.修改了原数组2.参数2.返回值删除的那个元素vararr=[1,2,3]arr.shift()//返回值是1   原数组变成了[2,3]

3.数组的反转

//数组.reverse()  反转数组vararr=[1,2,3,4]arr.reverse()console.log(arr)//[4,3,2,1]

4.数组的排序

//数组.sort()     数组排序vararr=[4,2,8,12,9]arr.sort(function(a,b){returna-b//数组升序})console.log(arr)//[2,4,8,9,12]arr.sort(function(a,b){returna-b//数组降序})console.log(arr)//[12,9,8,4,2]

5.数组的索引

//根据元素找下标   indexOf()    lastIndexOf()//indexOf()   从数组的左边向右边找,找到一个就马上返回下标   没有找到返回-1//lastIndexOf()   从数组的右边向左边找,找到一个就马上返回下标   没有找到返回-1vararr=[1,2,3,4,5,3]console.log(arr.indexOf(3))//2console.log(arr.indexOf(8))//-1console.log(arr.lastIndexOf(3))//5console.log(arr.indexOf(7))//-1//案例 数组去重//方案1vararr=[1,2,3,a,"b",2,"c","a"]varnewArr=[]for(vari=0;i<arr.length;i++){if(newArr.indexOf(arr[i])===-1){newArr.push(arr[i])}}console.log(newArr)//方案2   暂时了解   可以关注数组的includes方法vararr=[1,2,3,a,"b",2,"c","a"]varnewArr=[]for(vari=0;i<arr.length;i++){if(!newArr.includes(arr[i])){newArr.push(arr[i])}}console.log(newArr)//方案3  暂时了解   可以关注数组的reduce方法vararr=[1,2,3,a,"b",2,"c","a"]varnewArr=arr.reduce(function(acc,value,index){if(!acc.includes(value)){acc.push(value)}returnacc},[])console.log(newArr)

6.数组转换为字符串

//数组.join()vararr=[1,2,3]varstr=arr.join()console.log(str)//1,2,3varstr=arr.join("&")console.log(str)//1&2&3

7.数组合并

//数组.concat()vararr=[1,2,3];varnewArr=arr.concat([4,5,6]);console.log(arr);//没有修改原数组console.log(newArr);//[1,2,3,4,5,6]

8.数组的截取

//数组.slice(start,end)vararr=[red,blue,yellow,pink,purple];varnewArr=arr.slice(1,3);console.log(newArr);//[blue,yellow]console.log(arr);//没有修改原数组//数组.splice(start,count)vararr=[red,blue,yellow,pink,purple];varnewArr=arr.splice(1,3);console.log(newArr);//[blue,yellow,pink]console.log(arr);//原数组修改了,截取后剩下的元素//面试题vararr=["小泷",刘虎,"小苍","小泽","xiaosa"];//=> [["小泷",刘虎,"小苍"],["小泽","xiaosa"]]varnewArr=[]while(true){if(arr.length===0){break}newArr.push(arr.splice(0,3))}console.log(newArr);

String字符串

1.根据字符找索引

//str.indexOf()  从左向右根据字符找索引,如果没有找到就返回-1//str.lastIndexOf()  从右向左根据字符找索引,如果没有找到就返回-1

2.根据索引找字符

//str.charAt(索引)//求字符串abcaba出现次数最多的字符及次数// abcaba => (a 3)// 第一步:abcaba => {a:3,b:2,c:1}// 第二步:{a:3,b:2,c:1} => a 3varstr="abcaba"varobj={}for(vari=0;i<str.length;i++){if(str.charAt(i)inobj){obj[str.charAt(i)]++//obj.a++   num++}else{obj[str.charAt(i)]=1//{a:1,b:1,c:1}}}// console.log(obj);varchar=nullvarmax=0for(varkinobj){//{a:3,b:2,c:1}if(obj[k]>max){max=obj[k]char=k;}}console.log(`出现次数最多的字符是${char},次数是${max}`);

3.截取

// 字符串.substr(start,length)varstr="学姐,你在哪里?"varstr1=str.substr(0,2)console.log(str1);//学姐//字符串.substring(start,end)varstr="学姐,你在哪里?"varstr2=str.substring(0,3)console.log(str2);//学姐,

4.替换

//字符串.replace(原字符|正则表达式,要替换的字符)varstr="我爱武汉小太妹和小太妹们";varstr1=str.replace("小太妹","小可爱")varstr2=str.replace(/小太妹/g,"小可爱")//正则表达式可以实现全部替换console.log(str1);//我爱武汉小可爱和小太妹们console.log(str2);//我爱武汉小可爱和小可爱们

5.分割

// 字符串.split(要分割的字符)varstr="小苍×刘虎×小泽"vararr=str.split("×")console.log(arr);//["小苍", "刘虎", "小泽"]

6.大小写转换

//字符串.toUpperCase()varstr="Hello World"varupper=str.toUpperCase()console.log(upper);//HELLO WORLD//字符串.toUpperCase()varstr="Hello World"varlower=str.toLowerCase()console.log(lower);//hello world

七.数据类型为什么分为值类型和引用类型

值类型:变量中存的是值本身

引用类型:变量中存的是地址

//练习console.log(123===123)//trueconsole.log({}==={})//falseconsole.log([]===[])//falseconsole.log(function(){}===function(){})//false//基本数据类型赋值操作  传的值//修改了其中的一个,另一个不变vara=100varb=aa=1000;console.log(b)// 100//复杂数据类型赋值操作  传的地址//修改了其中的一个,另一个也会变vararr1=[1,2,3]vararr2=arr1arr1[1]=20;console.log(b)//[1,20,3]//案例varc;varchangStuff=function(a,b,c){a=a*10;b.item="changed";c={item:"changed"};}varnum=10;varobj1={item:"unchanged"};varobj2={item:"unchanged"};changStuff(num,obj1,obj2);console.log(num);//10console.log(obj1.item);//changedconsole.log(obj2.item);//unchangedconsole.log(c);//undefined

八.预解析

预解析:代码执行分为两个步骤:预解析阶段 和 执行阶段

预解析相当于是对代码的扫描

关注两个关键词: var 与 function (这个function不是匿名函数的function,而是声明式的function)

1.var 变量名

​ 判断当前内存作用域中是否存在变量

​ a.如果不存在,在内存中开辟空间 变量名指向该空间,这个空间此时的值是undefined

​ b.如果存在,忽略,不再在内存中开辟空间了。

2.function 函数名

​ 判断当前内存作用域中是否存在函数名

​ a.如果不存在,在内存中开辟空间 函数名指向该空间,并且这个空间保存的是函数体的地址

​ b.如果存在,在内存中不开辟空间 但是这个空间也会指向函数体的地址

3.函数调用时,进入函数体内也会在函数内作用域进行预解析

//练习1console.log(a);//undefinedvara=8;functionfn(){console.log(a);//undefinedvara=15;}fn();console.log(a);//8// 练习2console.log(a);//undefinedvara=8;functionfn(){console.log(a);//8a=15;}fn();console.log(a);//15// 练习3  预解析时,只有函数的{}才能限定作用域vara=true;functionfn(){if(!a){vara=10;}console.log(a);//10}fn();// 练习4varnum=123;functionf1(){console.log(num);}functionf2(){console.log(num);varnum=456;f1();console.log(num);}f2();// 练习5varnum=123;functionf1(){console.log(num);}functionf2(){console.log(num);num=456;f1();console.log(num);}f2();// 练习6 预解析时,函数有参数时是 预解析在前 还是 参数赋值在前?答:赋值在前functionfn(a){//var a = 100console.log(a);vara=10;console.log(a);}fn(100);// 练习7 当变量名与函数名冲突时functionfn(a){// var a = 100console.log(a);vara=10;console.log(a);functiona(){console.log(a);}a();}fn(100);

声明:本文部分素材转载自互联网,如有侵权立即删除 。

© 版权声明
THE END
喜欢就支持一下吧
点赞0赞赏 分享
相关推荐
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容