一、JavaScript简介

JavaScript#xff08;简称“JS”#xff09;是一种具有函数优先的轻量级#xff0c;解释…本篇文章给大家谈谈javascript教程完整版以及javascript入门经典希望对各位有所帮助不要忘了收藏本站喔。

一、JavaScript简介

JavaScript简称“JS”是一种具有函数优先的轻量级解释型或即时编译型的编程语言。

虽然它是作为开发Web页面的脚本语言而出名但是它也被用到了很多非浏览器环境中JavaScript基于原型编程、多范式的动态脚本语言并且支持面向对象、命令式、声明式、函数式编程范式python

2.主要功能

5.检测访客的浏览器信息。

控制cookies包括创建和修改等。

3.使用方式

使用prompt可将信息输入格式为prompt“需要输入的语句”

第一种alert

输出则是在网页的控制台按F12或者鼠标右键检查可找到控制台上进行输出。

2.变量

初始化值;2)定义所有的变量都是var,而且var可以省略不写!3)js中,变量可以重复定义的,后面的值将前面的值覆盖!2基本数据类型

//查看一个变量的数据类型的行数:typeof(变量名)//基本数据类型划分://1)无论是整数还是小数,数据类型number类型//2)布尔类型

:boolean

:无论变量值字符串还是字符:结果都是string//4)未定义类型:undefined(没有意义的)//5)引用数据类型:object类型:对象类型3.三元运算符

表达式无论简单还是复杂,结果是boolean类型,true或者false。

//需求:有两个变量,比较两个变量的最大值?//定义两个变量var

;var

;//(表达式)?执行true的结果:执行false的结果;var

max

;[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-iaKHhrpZ-1689995733667)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230721202551829.png)]

4.位运算符

常用的位运算符有四个分别是位与位或|位异或^反码~。

计算机在对数据进行计算的时候,

需要将这些数据进行补码操作

00000100------------------00000000根据有0则0的特点计算出3

document.write((3

00000100------------------00000111有二进制转换为十进制可得3

document.write((3

00000100------------------00000111

解法如下~3:

00000011(全部都按位取反:不分最高符号位)11111100

------补码

反码---------------------------------1

0000100

/title/titledocument.write(我即将成为代码大神!br

/)document.write(我要努力学习Java!)//headbody/body

/html​

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-o32sWuhq-1689995733668)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722091325564.png)]

2选择结构语句

prompt(请输入一个数字)if(a0){document.write(我要努力学习后端!)}//headbody/body

/html​

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-dGILGlop-1689995733669)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722092036426.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-vYL3svYI-1689995733669)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722092104213.png)]

最终得到

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-JJyDEVf8-1689995733669)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722092120496.png)]

if语句格式2

prompt(请输入一个数字)if(a0){document.write(我要努力学习后端!)}else{document.write(我要努力学习前端!)}//headbody/body

/html​

上述代码执行后与格式1相同先会跳出一个警告框不同的是格式1在警告框中输入小于等于0的数什么也不会输出而在格式2中输入小于等于0的数则会输出else里的语句既我要努力学习前端!

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Kbvfup3h-1689995733670)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722092650093.png)]

if语句格式3

执行流程先判断表达式1是否成立,成立则执行语句1,如果不成立,继续判断表达式2是否成立,成立,则执行语句2如果都不成立,最终执行else中的语句;​

if语句格式3实例如下

prompt(请输入一个数字)if(a0){document.write(我要努力学习java!)}else

if(a1){document.write(我要努力学习python!)}else

if(a2){document.write(我要努力学习c!)}else{document.write(我要努力学习后端语言!)}//headbody/body

/html​

上述代码运行后同样会出现警告框此时可以在警告框中输入012以及其他数字共计四种情况当输入0时会出现”我要努力学习java“当输入1时会出现”我要努力学习python“当输入2时会出现”我要努力学习c“当输入其他数字时则会出现”我要努力学习后端语言“

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-icgpxjI8-1689995733670)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722093504027.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-jcoSYG8x-1689995733671)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722093520308.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-j73NFjrq-1689995733671)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722093529554.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-31ytrk5g-1689995733672)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722093547912.png)]

switch语句

执行流程:使用switch后面的变量值和case的值1进行匹配,如果匹配,执行语句1,break语句结束;如果值1不匹配,判断case后面的值2是否和switch后面的值进行匹配如果匹配,则执行语句2,break语句结束;如果也不匹配,...上面都不匹配,执行default的语句n,遇见break语句结束!​

switch语句实例如下

parseInt(week_day)switch(week_day){case

:document.write(今天是周一)breakcase

:document.write(今天是周二)breakcase

:document.write(今天是周三)breakcase

:document.write(今天是周四)breakcase

:document.write(今天是周五)breakcase

:document.write(今天是周六)breakcase

:document.write(今天是周日)breakdefault:document.write(很抱歉地球上没有这个星期)break

}//headbody/body

上述代码执行后弹出警告框在里面输1则会的到”今天是周一“这个结果依次输入就会得到其他结果而输入1-7的其他数字则会得到”很抱歉地球上没有这个星期“。

3循环结构语句

当我们需要在浏览器上输出许多相关类型或者相同的语句时单纯使用document.write会有代码冗余度过大代码的重复度高等弊端所以我们需要引进循环结构语句。

首先看for循环

for循环的格式for初始化语句;条件判断语句;控制体语句{循环体语句}​

for循环实例如下

;i5;i){document.write(我要成为代码大神!br

/)}//headbody/body

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-z3JePavc-1689995733672)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722095653778.png)]

while循环

a0while(a10){aaa}document.write(a)//headbody/body

/html上述代码使用while循环求1-5的和取得结果为15。

for循环和while的区别?1)格式不同for(初始化语句;

条件表达式;控制体语句){循环体语句;}初始化语句;while(条件表达式){循环体语句;控制体语句;}2)内存角度考虑:优先使用forfor循环结束,里面的变量就会从内存中释放掉,节省内存资源while循环结束,依然能访问这个变量,初始化语句在外面定义的3)从应用场景:明确循环次数使用for不明确循环次数使用while举例:键盘录个字符串:给3次机会,判断用户是登录成功开发中,优先使用for循环

while循环

初始化语句;do{循环体语句;控制体语句(步长语句);}while(条件表达式)

执行流程初始化语句赋值执行循环体控制体语句进行自增或者自减判断条件是否成立,成立,继续执行循环体,不成立,结束!以下为do

!DOCTYPE

1;do{document.write(我要成为代码大神!br/)

;}while(i5)

(开发中,用的很少)底层源码使用多:js前端框架(Jqeury)后端语言:java语言(面向对象)集合/后面常用类的方法中见到源码:涉及到do-while*for循环嵌套

for(初始化语句1;条件表达式1;控制体语句1){//循环体:for循环for(初始化语句2;条件表达式2;控制体语句2){循环体语句;}}for循环嵌套示例如下

!DOCTYPE

1;ji;j){document.write(i*ji*jensp;)}document.write(br

/)}//headbody/body

/html上述代码使用for循环嵌套做一个99乘法表执行结果如下图

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-tcKMwF9T-1689995733673)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722103209060.png)]

我们所学的跳转控制语句有两种其一是break其二是continue。

注二者都不能单独使用。

break

break的作用是中断结束一般用于switch语句与循环语句都是起到终止作用。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-wJTmJFOn-1689995733673)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722104824164.png)]代码如上述所示时会输出5行5列*

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-msRLmzmo-1689995733673)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722104855879.png)]

将ifj2{break

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Xk30opse-1689995733673)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722104935637.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-VBTk0zbn-1689995733674)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722105029997.png)]

而continue语句则是跳出当前循环进入下一次循环并不会结束循环。

!DOCTYPE

;//结束当前这个循环,立即进入下一次循环}document.write(ibr/)

;}//headbody/body

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-M4ik7S3D-1689995733674)(C:\Users\12390\AppData\Roaming\Typora\typora-user-images\image-20230722105236214.png)]

三、函数

函数名(参数名1,参数名2,....){完成的函数的逻辑return

结果;

parseInt(n)princfb(m,n)function

princfb(m,n){for(var

/html上述用函数写出了一个nn乘法表也就是输入一个数就可以看到那个数的乘法表

function

函数名(形式参数1,参数参数2...){//三元/if语句return

最大值;}实例如下

;document.write(三个数据最大值是:maxbr/)

单个单词:字母全部小写多个单词:第一个单词全部小写,从第二个单词开始首字母大写,其余小写4.函数使用的注意事项

1)定义函数的时候,形式参数上不能携带var。

2)函数定义的格式不能省略{},否则不是一个函数,浏览器中js引擎是无法识别的。

3)如果这个函数没有返回结果,那么赋值调用的是undefined(未定义)。

4)无论任何语言中,有右括号的地方不能有分号,否则函数是没有函数体没有函数体的方法是没有意义的。

四、数组

数组:可以存储多个同一种类型元素的一个容器!在java语言中,数组可以存储不同类型的元素,但是开发中,数组存储的必须为同一类型的元素!2.数组的格式

数组名称

/html以上使用了数组代码执行后会在警告栏中弹出数组的数字直到数组结束为止。

五、结语

感谢大家看完这篇文章真心希望这篇文章可以给大家带来帮助同时也祝愿大家成为真正的代码大神