JavaScript是一种能让你的网页更加生动活泼的语言,你可以利用JavaScript轻易的做出亲切的欢迎讯息、漂亮的数字钟、有广告效果的跑马灯及简易的选举,还可以显示浏览器停留的时间。让这些特殊效果提高网页的可观性,和用户更好的交互。是web2.0时代不可或缺的客户端语言。
JavaScript能用来干什么?
1.数据的验证。
2.将动态的内容写入到网页当中。
3.可以对事件做出响应。
4.可以读写html中的内容。
5.可以检测浏览器
6.可以创建cookies
7.模拟动画…
JavaScript语法特点
基于对象 和 事件驱动 的 松散型的 解释性 语言
1、javascript面向对象开发的
2. 事件驱动
3.松散型 弱类型
var a="asc";var a=123;
4.解释型语言。
由宿主环境(浏览器)解释执行
JavaScript的组成部分
JavaScript基础语法
JavaScaript输出工具输出工具
A. alert(); 弹窗 会以文本的原格式输出
B. document.write() 输出到页面,会以html的语法解析里面的内容
C. prompt(“”,“”) 输入框JavaScaript放置引用A.B.可以在超链接或是重定向的位置调用javascript代码格式:"javascript:alert('我是超链接')"重定向格式:action="javascript:alert('我是表单')"C.在事件后面进行调用格式:onclick="alert('我是事件')"
D.调用外部JavaScript文件格式:放置的时候注意事项
1.JavaScript可以在html页面当中的任何位置来进行调用, 但是他们还是一个整体,是相互联系,相互影响。
2.在调用页面标签对当中不能有任何代码在js脚本中不能出现
标签对。JavaScript注释
行内注释: // 注释内容
块注释:/* 注释内容*/
对付旧的浏览器JavaScript变量变量:可以存储数据的一个容器。可以存储和引用任何的数据。变量的创建:一般来 说要以“var”关键来修饰。A.先声明,后赋值var b;b="www.baidu.com";B.声明和赋值同时进行var url="www.sxuek.com";
C.一次声明多个变量,然后再赋值var name, age ,sex;name="lisi";age=14;sex="boy";
D.一次声明多个变量同时进行赋值。var name="wangwu",age=17,sex="girl";
JavaScript命名规范
1. 严格区分大小写
2. 变量的命名必须以字母或 _或 $开头,余下的部分可以是任意的字母,数字,或者是 _或者是$
3.不能用关键字或者是保留字命名。
4.javascript自己的命名习惯驼峰命名法:getElementById首字母大写:Object
5.命名一定要有意义。
6. ;的用法
声明变量注意的问题
1.覆盖已有变量
A.如何重新声明该变量,而没有赋值,该变量的值不会改变
B.如果重新声明该变量并且重新赋值,那么旧的变量值会删除,改为新的变量值。
2.不用var 关键字来修饰变量aa="我是没有声明的“alert(aa);
A.如果不用var关键来修饰的变量,并且这个所谓的变量也没有赋值,那么javascript会 报错。
B.如果不用var关键来修饰的变量,但是变量赋值了,那么javascript会把他当作一个全 局变量来处理,不会报错。但是我们不推荐使用。
JavaScript中的数据类型
1.初始类型(基本类型)
– Undefined– Null– Number– String– Boolean
2.引用类型– object (class)JavaScript中的数据类型
typeof 操作符– 他是用来检测数据类型的一元运算符,并且返回的结果始终是一个字符串。初始类型-String类型
用单双引号来说明,他所包围的值都可以是字符串。
单双引号的用法:
– 效率是一样的
– 只能成对出现,不能相互交叉使用
– 可以相互嵌套。
– 还包括一些特殊的字符:
– \n 换行
– \t 制表符
– \b 空格
– \r 回车
– \' ‘
– \" “
– \\ \
初始类型-Number类型
Number数值类型
包括整型和浮点型。支持二进制、八进制、十进制、十六进制。用科学计数法来表示,还包括一些特殊的值:
Number.MAX_VALUE 最大值
Number.MIN_VALUE 最小值
初始类型- Undefined
Undefined指的就是变量创建后但是没有赋值,而变量的默认值就是undefined.
初始类型- null
Null
指的是什么都没有,是一个空对象。相当于一个占位符。
引用类型
object (class)
包含相关属性和方法的一个集合。
new 关键字。
var obj=new Object()
var obj={};
JavaScaript运算符
运算符和操作数的组合就称为表达式。
算术运算符
关系运算符(比较运算符)
赋值运算符
逻辑运算符
一元运算符
三元运算符
特殊运算符
算数运算符
+ - * % var++ ++var var-- --var
– “+” 加号(字符串连接号)
• 用于数值的运算
• 用于字符串的连接
– 任何的数据类型和字符串相加都是等于相加以后的字符串
– “%”(取余)
(1)用来取某个数的余数
(2)用于取一段范围的值
(3) 一般不用于小数,因为结果不确定。
– var++
• 先运行,再自增,比较无私,先人后己
– ++val• 先自增,再运行,比较自私,先己后人
关系运算符(比较运算符)
< > <= >= == === != !==
– 他们运算的结果都是布尔值。
– == 比较两个数的值是否相等
– === 不但比较值是否相等,还比较类型是否相等。
关系运算符(比较运算符)注意
• 都是数值的时候,他会正常比较
• 如果两个都是字符串进行比较,从他们的第一个开始先转换为ASCII码值开始依次比较,直到比较出大小。
• 当一个字符串,另一个是数值的时候,把字符串尝试转换成数值类型,然后进行比较,如果不能转换成数值类型 ,返回假
•如果两个数值都为字符串 则把第一个值进行转换ASCII码后比较大小;
• undefined== null为真
• 如果一个数值和布尔值进行比较,会把布尔值转换为数值再进行比较,true为1,false为 0
赋值运算符
= += -= *= /= %=
– +=
var num=1 ;
num+=3;
num=num+3
逻辑运算符
与 and && 或 or || 非not !
– &&
• 运算符两边只要有一个是假,那么他的运算结果就是假,只有两个都为真的时候,运算结果才是真的。
– ||
• 算符两边只要有一个是真的那么他就是真的,只有当两个都是假的时候,他才是假的。
– !
• 取反,假的变成真的,真的变成假的。逻辑运算符注意
• 逻辑运算符可以对任何类型的数据进行运算但是在运算的时候,可以转换为对应的布尔值 Boolean• Undefine false
• Null false
• Boolean 就是本身的值
• Number 除了0以外都是真的
• String 除了空字符串以外都是真的
• 对象 真的一元运算符
typeof + - delete new ++ --
– +
• 正号、正数
– delete
• 删除对象的方法或是属性
– new
• 用来创建一个对象
三元运算符
根据表达式的计算结果有条件的为变量赋值
格式:
var 变量= Boolean expression?条件为真的值:条件为假的值
特殊运算符
“,” “()”
– “,”
• 用来一次声明多个变量– “()”
• 在运算的时候有优先级的作用
• 可以让函数运行
JavaScript流程控制
流程:就是程序代码的执行顺序。
流程控制:通过规定的语句让程序代码有条件的按照一定的方式执行
顺序结构
–按照书写顺序来执行,是程序中最基本的流程结构。
选择结构(分支结构、条件结构)
–根据给定的条件有选择的执行相应的语句
循环结构
–在给定的条件满足的情况下,反复的执行同一段代码。
选择结构(分支结构、条件结构)
1.单路分支
//条件可以是表达式也可以是任何的数据类型
//大括号会把他里面的代码当作一个整体来运行,如果只有一条语句,可以省略大括号
if(条件){
条件成立执行的语句
}
2.双路分支
if(条件){
条件成立的时候执行的代码
}else{
条件不成立的时候执行的代码
}
选择结构(分支结构、条件结构)
3.多路分支
if(条件1){
条件1成立执行的代码
}else if(条件2){
条件2成立执行的代码
}else if(条件3){
条件3成立执行的代码
}.....
.else{
如果上述条件都不成立执行的代码
}
选择结构(分支结构、条件结构)
4.嵌套分支
if(条件1){
if(){
}else if(){
}....
}else if(条件2){
条件2成立执行的代码
}else if(条件3){
条件3成立执行的代码
}......
else{
如果上述条件都不成立执行的代码
}
选择结构(分支结构、条件结构)
switch语句
switch(变量任何的数据类型){
case 值1:
表达式1;
break;
case 值2:
表达式3;
break;
.........default:
表达式;
}
分支结构注意事项
1.当判断某种范围的时候最好用if语句,当判断单个值时候用switch
2.条件满足的情况不可以重复,会发生不可预期的错误。
循环结构
循环:在给定的条件满足的情况下,重复的执行同一段代码。
1.for循环
for(变量=初始值;变量<=结束值;变化值){
循环体;
}
如:
for(var i=0;i<5;i++){
alert(i); //循环到第几次
}
循环结构
2.while循环
当条件满足的时候,执行循环体,当不满足的时候退出循环
while(表达式){
循环体;
}
先最少执行一次,再进行条件的判断,如果条件满足继续执行,如果不满足则退出循环。
do{
}while(表达式)
循环结构注意问题
1.do{}while 和while的区别
while:当条件满足的时候,执行循环体,当不满足的时候退出循环,先判断后执行。
do{}while:先最少执行一次,再进行条件的判断,如果条件满足继续执行,如果不满足则退出循环。
2.for 和while的区别
for一般是用于循环指定的次数
while是根据条件的真假来循环,当真的时候进行循环,假的时候退出循环。
循环结构中的跳转语句
在循环控制语句中,当 满足指定条件 的时候,退出循环 或者是退出 当前 循环的语句。
1.break;
语法:break;
跳出并且终止循环,如果后面有代码,则继续往下执行。
2.continue;
格式:continue;
跳出并且终止当前的循环,如果下个值仍满足循环条件,则继续循环。
循环结构中的跳转语句
跳出多层循环
语法:
标签名:语句;
注意:标签名只可以作用于break 或continue
JavaScript函数
函数:将完成某一特定功能的代码集合起来,可以重复使用的代码块。
优点:
– 使程序更加简洁
– 逻辑性更调理
– 调用更方便
– 维护更加容易
函数的声明方式(创建)
A.基本语法
function 关键字
function 函数名([参数1],[参数2]....){
函数体
[retrun] //返回值
}
B.字面量定义的形式(匿名函数)
var 变量=function ([参数1],[参数2]....){
函数体
[retrun] //返回值
}
C.以对象的形式来声明
new 关键字。
var 变量=new Function([参数1],[参数2]...,"函数体");
函数的调用方式
通过括号来调用
– 函数名()
– 变量名()
通过触发事件来调用
– 对象.事件=function (){}
自调用
– (function (){})()
创建\调用函数注意问题
如果两个函数的命名相同,后面的将会覆盖前面的函数。
以基本语法声明的函数,会在页面载入的时候提前解析到内存中,以便调用。所以可以在函数的前面调用。但是以字面量形式命名的函数,会在执行到他的时候,才进行赋值。所以只能在函数的后面调用
在不同的<script></scricp>块中,因为浏览器解析的时候是分块解析的,所以前面的块不能调用后面块的函数,所以在不同的块之间调用函数的时候,应该先定义后调用。
带有参数的函数
参数的作用:
可以动态的改变函数体内对应的变量的值,使同一函数体得到不同的结果。
形参:在定义函数的时候,函数括号中定义的变量叫做形参。用来接受实参的。
实参:调用函数的时候,在括号中传入的变量或值叫做实参。用于传递给形参.
参数详解
参数的类型
– 可以是任何的数据类型。
参数的个数
– 实参和形参数量相等,一一对应。
– 实参小于形参,不会报错,多出形参的值会自动赋值为undefined
– 实参大于形参,不会报错,但如果要获得多出实参的值,需要用arguments对象来获取
arguments对象详解
每创建一个函数,该函数就会隐式创建一个arguments对象,他包含有实际传入参数的信息。
arguments对象的属性
– length 获得实参的个数
– callee 获得函数本身的引用
– 访问传入参数的具体的值。arguments[下标]
模拟函数重载函数重载
– 同一个函数因为参数的类型或数量不同,可以对应多个函数的实现,每种实现对应一个函数体。
函数的返回值
return 语句
– 通过return 语句给函数一个返回值,停止并且跳出当前的函数
return语句的用法
– 在return 语句后面的函数体内所有内容都不会输出。
– 在函数体内可以有多个return语句,但是只会执行一个。(判断语句)
return语句的返回值
– 返回值可以是任何的数据类型
– 只能返回一个返回值。
– 如果函数没有返回值,那么这个函数的值就会自动的赋值为undefined
变量的作用域
作用域:指的就是一段代码的作用范围。
全局变量在页面中任何地方都能够访问得到的变量,拥有全局的作用域。
A.函数的最外层定义的变量。
B.没有定义直接赋值的变量,拥有全局属性
局部变量
只能在固定的代码片段(函数片段中)中访问到。
A.函数内部定义的变量,就是局部变量。
B.参数也是局部变量。
*可以提高程序的逻辑性和安全性,减少名字的冲突。
作用域链
我们可以把所有作用域看成是有一个链条链接起来的,这样能使变量和函数能够有序有机的进行运行。
JavaScript代码运行环境
1.宿主环境
2.执行环境
执行的环境决定了变量和函数的作用域
A.全局环境
B.函数环境
JavaScript预解析顺序
一、<script></script>块依次解析。
二、解析代码运行的环境。
三、对标识符(关键字)(var function )进行解析,解析到相应的环境下。
四、如果还有块再按照上面的步骤依次解析。
JavaScript回调函数
通过函数的指针来调用函数。
– 把一个函数的指针做为另一个函数的参数,当调用这个参数的时候,这个函数就叫做回调函数。
JavaScript递归函数
在函数内部直接或间接的调用自己。
JavaScript内嵌函数
在函数内部再嵌套函数(闭包)
网友评论