一、什么是Javascript?
JavaScript一种解释性脚本语言，是一种动态类型、弱类型、基于原型继承的语言，内置支持类型。
它的解释器被称为JavaScript引擎，作为浏览器的一部分，广泛用于客户端的脚本语言，用来给HTML网页增加动态功能。
二、Javascript的使用方式
(1)内部方式:
在head标签体中或者body下面书写script标签,type默认不写.(省略 脚本类型"text/jscript" 或者"text/javascript").
(2)外部方式:
导入外部js文件.scr属性=“js文件地址”
二、变量的定义
什么是变量?
在程序的执行过程中,其值在不断发送改变的量!
什么是变量?
js定义变量的注意事项:
(1)定义变量的三要素 :var 变量名 = 初始化值;
(2)定义所有的变量都是var,而且var可以省略不写!
(3)js中,变量可以重复定义的,后面的值将前面的值覆盖!
//javavscript:是一个弱类型(语法结构非常不严谨)
//java语言:后端语言的一种强类型语言(语法结构非常严谨)
jsjs变量的命名规则:
一个变量只能由 字母(a-z, A-Z) 数字(0-9) 下划线(_) 美元符($) 组成
一个变量不能由 数字 开头
变量严格区分大小写
不要使用关键字或保留字
基本数据类型划分:
首先,了解查看一个变量的数据类型的函数:typeof(变量名)
基本数据类型划分:
1)无论是整数还是小数,数据类型number类型
2)布尔类型 :boolean :用于逻辑判断:要么true(真) false(假)
3)字符串类型:string :无论变量值"字符串"还是'字符':结果都是string
4)未定义类型:undefined(没有意义的)
引用数据类型:
4)object类型:对象类型
三、Javascript的运算符
1、算术运算符
基本的算术运算符: (js中/不会默认取整,而java语言默认取整!)
+,-,*,/,%模(求余)
扩展的算术运算符
++或者--
单独使用:
无论++或者--在数据的前面还是后面都是对当前这个值进行自增1或者自减1
参与运算:
1)++或者--在数据的前面,先自增或者自减,然后运算
2)++或者--在数据的后面,先运算在自增或者自减
例子://参与运算使用:++或者--在数据的前面
//var m = ++x ;//++3 = 4--->赋值给m,m结果4
//var n = --y ;//--4= 3 --->赋值给n,n结果3
//参与运算使用:++或者--在数据的后面
var m = x ++ ;//将x先赋值给m,m的值3 ,x变量在自增3++ 4
var n = y -- ;//将y先赋值给n,n的值4 ,y变量自减 4-- 3
2、赋值运算符
基本的赋值运算符 就是"="
var 变量名 = 值;
将值赋值给变量名
注意事项:
"="不写成==
扩展的赋值运算符:
+=,-=,*=,/=,%=
将扩展的赋值运算符左边的变量和右边数据值操作后,
在赋值给左边的变量 ;
var a = 10 ;
a += 20 ;//拿a+20在赋值给a 等价于 a = a+20 ;
3、逻辑运算符
逻辑运算符的基本符号:
逻辑单与&:并列关系,多个条件同时满足
有0则0(有false则false,有一个满足不成立!)
逻辑单或|:多个条件只要满足一个即可成立
(有1则1;有true则true,有一个满足则成立)
逻辑异或^:
相同则为false(0)
不同则为true(1)
简单记:
男女关系
男女 女男 : true (1)
男男 女女 : false (0)
逻辑非! :非true则fasle,非fasle则true
偶数个非是它本身
逻辑双与& (有false则false :和逻辑单与& 一样:共同点
逻辑双或||:有true则true
4、三元运算符
运算符 带有一定逻辑判断
(表达式)?执行ture的结果:执行false的结果;
四、流程语句
4.1选择结构语句之if语句
if语句格式1：
if(表达式){
语句;
}
执行流程:如果表达式成立,则执行语句;否则不执行!
if语句格式2
场景:针对两种情况判断
if(表达式){
语句1;
}else{
语句2;
}
执行流程:
如果表达式成立,则执行语句1,否则,执行语句2;
if语句格式3:应用场景:针对多种情况判断
if(表达式1){
语句1;
}else if(表达式2){
语句2;
...
}else{
//上面都不匹配,执行else中语句
语句n;
}
流程:
先判断表达式1是否成立,成立则执行语句1,
如果不成立,继续判断表达式2是否成立,成立,则执行语句2
如果都不成立,最终执行else中的语句;
4.1.1if语句和三元的区别
if格式2的范围大,它是流程控制 语句,它不仅里面可以使用
赋值的方式去接收变量,也可以去使用输出语句document.write(xx);
而三元运算符,是运算符号,只能操作具体的数据值,要么string/number...
不能在里面嵌套使用输出语句document.write(xx)
如果需求能够使用三元实现的,一定能够使用if格式2实现
if格式2能实现的,不一定能使用三元
*/
//需求: 键盘录入一个数据,判断这个数据是否是偶数
//用if格式2实现
var num = prompt("请您输入一个数据:") ;
num = parseInt(num) ;
//var str = "" ;
if(num%2==0){
document.write(num+"是偶数") ;
// str = "是偶数"
}else{
document.write(num+"是奇数") ;
// str = "是奇数"
}
document.write("<hr/>") ;
//document.write((num%2==0)?((document.write(num+"是偶数")):((document.write(num+"是奇数")));
document.write((num%2==0)?"偶数":"奇数") ;
4.2选择结构语句之switch语句
switch格式
switch(表达式或者某个变量){
case 值1:
语句1;
break ;
case 值2:
语句2;
break ;
...
...
default:
语句n;
break ;
}
执行流程:
使用switch后面的变量值和case的值1进行匹配,
如果匹配,执行语句1,break语句结束;
如果值1不匹配,判断case后面的值2是否和switch后面的值进行匹配
如果匹配,则执行语句2,break语句结束;
如果也不匹配,...上面都不匹配,执行default的语句n,遇见break语句结束!
!!switch语句的注意事项:
javascript中的switch
1)switch语句中case语句后面的值可以是常量,也可以是变量!
2)如果case语句中没有携带break语句,就会造成一种现象"case穿透"(灵活运用)
3)switch语句的结束条件: (重点)
1)遇见break结束 (break:跳转控制语句 中断/结束!)
2)程序默认执行到末尾
4)default语句可以在switch中的任何位置,不影响switch的执行流程
如果default在语句中,break不要省略
如果default在语句的末尾,break是可以省略的(建议不要省略!)
五、循环语句
5.1 for循环的格式
*for(初始化语句;条件判断语句;控制体语句){
循环体语句;
}
执行流程:
1)初始化语句对变量进行初始赋值(执行一次即可)
2)判断条件语句是否成立,如果成立,则执行循环体语句
3)执行控制体语句(步长语句)这个变量自增或者自减
4)判断条件是否成立,成立,继续执行循环体语句,
再次回到3)继续操作....
5)当条件表达式不成立,循环结束!
循环也称为"遍历"
5.1.1 for循环求和思想
/**
* 求和思想:
* 0 + 1 =1
* 1 + 2 = 3
* 3 + 3 = 6
* 6 + 4 = 10
* 10 + 5 = 15
* .....
*
* 两个加数:
* 前面这个加数:从0开始, 记录每一次求和的结果
* 后面的这个加数:就是1-10之间的每一个数据
*
* 操作:
* 1)定义最终结果变量sum:0开始
* 2)循环:将范围的内的数据一一获取到: 1-10
* 2.1)循环中的循环体语句
* sum = sum + 当前循环的变量
* 简写sum+=变量
*/
//求1-100之间的和
var sum2 = 0 ;
for(var x = 1 ; x <=100 ; x++){
sum2 = sum2 + x ;
}
document.write("1-100之间的和是:"+sum2+"<br/>") ;
document.write("<hr/>") ;
//求1-100之间的偶数和
var sum3 = 0 ;
for(var x = 1 ; x <=100 ; x++){
//获取到1-100的数据
if(x % 2 ==0){
sum3 = sum3 + x ;
}
}
document.write("1-100之间的偶数和是:"+sum3+"<br/>") ;
//求8的阶乘! 8*7*6*5*4*3*2*1
document.write("<hr/>") ;
//定义结果变量
var jc = 1 ;
for(var j = 2 ; j <= 5 ;j++){//2 3 4
jc *= j ; //jc =1* 1
//jc = 1* 2
//jc = 2 * 3
//jc = 6 *4
}
document.write("5的阶乘是:"+jc+"<br/>") ;
/*
n!=n*(n-1)!
5!=5*4*3*2*1
求阶乘思想和求和思想相同
定义结果变量 jc = 1;
for(var x = 1 ; x <=5 ;x++){
jc*=x ; //jc = jc * x = 1 * 2
}
*/
5.1.2 for循环统计思想
//需求:统计水仙花数有多个?
/**
* 统计思想:
* 1)先定义一个统计变量:初始化0
* 2)水仙花-3位数 明确范围,循环思想
* 3)计算每一个位的数据本身
* 4)当前这个数据就是 个位的立方+十位的立方+百位的立方 ,满足这个条件
* 4.1) 统计变量++
* 5)输出统计变量
*/
var count = 0 ;
for(var i = 100 ; i <=999 ; i++){
//定义三个变量,个位,十位,百位
var ge = i % 10 ;
var shi = (Math.floor(i /10)) %10 ;
var bai = (Math.floor(i/10/10)) %10 ;
if( i == (ge*ge*ge+shi*shi*shi+bai*bai*bai)){
count ++ ; //++
document.write("第"+count+"次的水仙花是:"+i+"<br/>") ;
}
}
document.write("水仙花数共有:"+count+"个<br/>") ;
5.2 while循环的格式
/**
* 通用格式:
* 初始化语句;
* while(条件表达式){
循环体语句;
控制体语句;(步长语句)
}
*
* 执行流程:
* 1)初始化语句先执行,进行赋值
* 2)判断条件表达式是否成立,成立,执行循环体语句,执行控制体语句
* 3)继续回到2)过程...如果条件不成立,结束!
*
*/
5.2.1 while循环求和和统计思想
/*
使用while循环完成
1)1-10之间的和
2)1-100之间的偶数和
3)求5的阶乘
4)输出所有的水仙花数
5)统计水仙花的个数
*/
//最终结果变量
var sum = 0 ;
//初始化语句
var i = 1 ;
while(i<=10) {
sum += i ;
i++ ;
}
document.write("1-10之间的和:"+sum+"<br/>") ;
var sum2 = 0 ;
//初始化语句
var x = 1 ;
while(x<=100) {
if(x % 2 ==0){
sum2 +=x ;
}
x ++;
}
document.write("1-100之间的偶数和:"+sum2+"<br/>") ;
document.write("<hr/>") ;
var i =100 ;
while(i<1000){
//定义变量
var ge = i % 10 ;
var shi = (Math.floor(i/10)) %10 ;
var bai = (Math.floor(i/10/10)) %10 ;
if((ge*ge*ge+shi*shi*shi+bai*bai*bai)==i){
document.write("水仙花数是:"+i+"<br/>") ;
}
i ++ ;
}
document.write("<hr/>") ;
//统计变量
var countNumber = 0 ;
var k =100 ;
while(k<1000){
//定义变量
var ge = k % 10 ;
var shi = (Math.floor(k/10)) %10 ;
var bai = (Math.floor(k/10/10)) %10 ;
if((ge*ge*ge+shi*shi*shi+bai*bai*bai)==k){
countNumber ++ ;
document.write("第"+countNumber+"次,水仙花数是:"+k+"<br/>") ;
}
k ++ ;
}
document.write("水仙花共有:"+countNumber+"个") ;
5.3.2 for和while的区别
/**
* for循环和while的区别?
*
* 1)格式不同
* for(初始化语句; 条件表达式;控制体语句){
循环体语句;
}
初始化语句;
while(条件表达式){
循环体语句;
控制体语句;
}
2)内存角度考虑:优先使用for
for循环结束,里面的变量就会从内存中释放掉,节省内存资源
while循环结束,依然能访问这个变量,初始化语句在外面定义的
3)从应用场景:
明确循环次数使用for
不明确循环次数使用while
举例:
键盘录个字符串:给3次机会,判断用户是登录成功
开发中,优先使用for循环
*/
5.4 死循环
在这里插入代码片
5.4.1 死循环的两种格式以及练习
/**
* 利用死循环可以完成一些事情
* for的死循环
* for(;;){
循环体语句
while(true){
完成逻辑
产生一个随机数
键盘录入数据,
判断数据大了,还是小了
如果相等,退出循环 break ;
}
}
*/
/* for(;;){
console.log("for循环的死循环..") ;
} */
/* while(true){
console.log("helloworld") ;
} */
//产一个随机数:javascript提供内置对象Math
//有一个函数:Math.random( ) :产生[0,1) 之间的数据 (小数)
/* for(var i = 0 ; i < 9 ; i++){
var number = Math.random() ;
document.write(number+"<br/>") ;
} */
//10个 1-100之间的随机数
/* for(var i = 0 ; i < 9 ; i++){
var number = (Math.floor(Math.random()*100 +1));
document.write(number+"<br/>") ;
} */
//猜数字游戏
//产生一个1-100之间的随机数
var num = (Math.floor(Math.random()*100 +1))
//alert(typeof(num)) ;
//定义统计变量
var count = 0 ;
//当不明确循环次数,都是while循环
while(true){
//统计变量++
count ++ ;
//键盘录入
var guessNum = prompt("请您输入一个数据:") ;
/* if(guessNum =="" || guessNum == " "){
alert("请输入数值类型的数据") ;
} */
//string--number
guessNum = parseInt(guessNum) ;
//如果猜的数字大于随机数
if(guessNum > num){
alert("您要猜的"+guessNum+"大了") ;
}else if(guessNum < num){
alert("您要猜的"+guessNum+"小了") ;
}else{
alert("恭喜您,第"+count+"次,猜中了") ;
//结束循环
break ; //中断
}
}
5.5 for和while循环的嵌套
5.5.1 for循环的嵌套1
/*
for(初始化语句1;条件表达式1;控制体语句1){
//循环体:for循环
for(初始化语句2;条件表达式2;控制体语句2){
循环体语句;
}
}
*/
练习:
//打印m行,n列的*形
for(var i = 0 ; i < m; i++ ){//0,1,2,3 外层:行
for(var j = 0 ; j < n; j ++){ //0,1,2,3,4 内存:列
document.write("*") ;
}
document.write("<br/>") ;
}
5.5.2 关键字
[1]关键字 break:
* break:中断,结束的意思
* 不能单独使用
* 两个场景中使用:
* 1)switch语句,本身格式就携带break
* 2)循环语句中使用
//break ; 不能单独使用
/**例子:
for(var x = 0;x<10;x++){
//判断
if(x == 3){
break ;//中断循环(结束循环)
}
document.write(x+"<br/>") ;
}
[2]关键字 continue:
* continue:继续的意思(结束当前循环,立即进入下一次循环)
* 不能单独用
* 不能脱离循环语句(loop)中使用!
* 场景:
* 网络聊天室:
* 功能:
* 上下线提醒
*
* 张三已经上线了,提示"李四上线了"
* "王五上线了",不能提示自己上线了 (当如果是张三,continue)
* 李四,王五上线
*
*/例子:
//continue ;
for(var i = 0 ; i < 10 ; i++){
if(i==3){
continue ;//结束当前这个循环,立即进入下一次循环
}
document.write(i+"<br/>") ;
}
[3]关键字 return:
return 一般在函数(方法中使用)
return:结束一个函数(方法),或者程序
不能单独用!
*/
/* document.write("程序开始了...<br/>") ;
for(var i = 0 ; i < 10 ; i++){
if(i == 3){
break ;
//return;//Illegal return statement 非法return语句
}
document.write(i+"<br/>");
}
document.write("over<br/>") ; */
function returnDemo(){
document.write("程序开始了...<br/>") ;
for(var i = 0 ; i < 10 ; i++){
if(i == 3){
//break ;
//return;//Illegal return statement 非法return语句(不能单独用)
return ; //函数结束
}
document.write(i+"<br/>");
}
document.write("over<br/>") ;
}
//调用函数
returnDemo() ;
六、函数
如何定义函数:
在js中定义函数的格式
function 函数名(参数名1,参数名2,....){
完成的函数的逻辑
return 结果; //返回结果
}
调用函数:
赋值调用:
var 变量名= 函数名(实际参数1,实际参数2..)
函数名以及变量名:遵循小驼峰命名法
//单个单词:字母全部小写
//多个单词:第一个单词全部小写,从第二个单词开始首字母大写,其余小写
6.1 函数使用的注意事项
//1)定义函数的时候,形式参数上不能携带var
//2)函数定义的格式不能省略{},否则不是一个函数,浏览器中js引擎是无法识别的
//3)如果这个函数没有返回结果,那么赋值调用的是undefined(未定义)
//4)无论任何语言中,有右括号的地方不能有分号,否则函数是没有"函数体",
//没有函数体的方法是没有意义的
6.2 有返回结果的函数的使用
//没有提示number类型
//需求:键盘录入三个数据,定义函数,获取三个数据最大值
/*
完成函数定义的心里明确:
1)这个函数有没有返回结果;
2)考虑参数的数据类型以及参数个数
*/
//定义函数
/**
* function 函数名(形式参数1,参数参数2...){
//三元/if语句
return 最大值;
}
6.3 函数的另一种格式
需要定义函数:里面输出5行5列的*形
*
* 没有具体的返回结果,的函数定义的时候,
* 跟有返回结果的函数定义相同,在函数体中直接输出!
* 调用:
* 单独调用
* 函数名(实际参数1,...) ;
*/
var m = prompt("请输入行数:") ;
var n = prompt("请输入列数:") ;
m = parseInt(m) ;
n = parseInt(n) ;
//调用下面的函数
//单独调用
printStar(m,n) ;
//定义打印*形的函数
function printStar(m,n){ //两个参数 行,列
for(var i = 0 ; i < m; i++){
for(var j = 0 ; j < n; j++){
document.write("*") ;
}
document.write("<br/>") ;
}
}
七、数组
7.1数组的创建
//创建一个数组
//动态初始化:不给定元素内容,已知数组长度
//固定的
//创建一个数组对象,3个长度(3个元素)
//格式:var 对象名 = new Array(长度) ;
var arr = new Array(3) ;
//数组的长度有一个属性:length
//数组对象名.lengtg:获取长度
alert(arr.length) ;
//给arr数组分配:
//数组的元素:数组名称[索引值(下标)]:索引值0开始
arr[0] = 20 ;
arr[1] = 10 ;
arr[2] = 25 ;
函数的三种创建格式:
var arr = new Array(3)
alert(arr.length);
arr[0]=10;
arr[1]=20;
arr[2]=30;
document.write(arr[0]+"<br/>") ;
document.write(arr[1]+"<br/>") ;
document.write(arr[2]+"<br/>") ;
document.write("<hr/>") ;
for(var i= 0;i < 3;i++){
document.write(arr[i]+"<br/>");
}
document.write("<hr/>") ;
var arr2=[1,2,3,4,5];
document.write("<hr/>") ;
document.write("[") ;
for(var i=0;i<arr2.length;i++){
if(i==)
}
7.2什么是数组
/**
* 数组:
* 可以存储多个同一种类型元素的一个容器!
* 在javascript语言中,数组可以存储不同类型的元素,
* 但是开发中,数组存储的必须为同一类型的元素!
*
* Js中本身就存在一个Array内置数组对象
* 固定格式:
* (动态初始化:不给定元素)
* var 数组名称 = new Array() ;//不指定长度
* var 数组名称 = new Array(size); //指定数组长度
* (静态初始化:给定具体元素)
* var 数组名称 = new Array([元素1,元素2,...]) ;
* 可以简写为
* var 数组名= [元素1,元素2,...] ;
*
* 数组的属性:length (长度)
* 数组名称.length
*
* 如何确定数组的元素
* 数组名称[角标值或者索引值]
* 索引值从0开始,数组的最大索引值=数组长度-1
*
*
* js(弱类型语言:语法以及结构都不严谨)中的数组:没有角标越界一说,它可以不断的给数组中追加元素!
*/
//方式1:var 数组名称 = new Array() ;//不指定长度
//var arr = new Array() ;
//方式2: var 数组名称 = new Array(size); //指定数组长度
//var arr = new Array(4) ; //4个长度
//方式3:var 数组名= [元素1,元素2,...] ;
var arr = [55,11,22,33,44] ;
alert(arr.length) ;
/* arr[0] = 10 ;
arr[1] = 20 ;
arr[2] = 55 ;
//再次赋值
arr[3] = 45 ;
arr[4] = 15 ; */
alert(arr.length) ;
//遍历:一一获取元素
for(var i = 0; i < arr.length;i++ ){ //i表示索引值
alert(arr[i]) ;
}
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
