04.01 javascript简介
概述:
- 1995年网景公司与sun公司合作开发。
- 是基于对象和事件驱动的脚本语言,应用在客户端,简称js。
- 基于对象:提供很多的对象,直接拿过来使用。
- 事件驱动:html做网站静态效果
- 客户端:专门指浏览器
js的作用:
- 操作html和css
特点:
- 交互性:上西安信息的动态交互
- 安全性:不可以直接访问磁盘上的信息。
- 跨平台:只要是可以解析js的浏览器都可以使用。
java和js的关系
- 没有任何关系,属于两门编程语言
- 开发公司:
- java:sun
- js:网景公司
- 对象:
- java:面向对象
- js:基于对象
- 数据类型:
- java:强类型语言【每个变量必须指定具体的数据类型】 int i=10
- js:弱类型语言【变量的数据类型由值决定】 var i = 10 python中:i = 10
js的组成:
- ECMAScript:
- ECMA:欧洲计算机协会
- 由ECMA组织指定js的一些列的语法
- BOM:Broswer Object Model,浏览器对象模型
- DOM:Docement Object Model文档杜希昂模型
04.02 js和html的结合方式
方式一:直接使用标签
<script type = "text/javascript">js代码</script>
方式二:使用script标签,引入外部文件
script标签可以可以出现多次,可以出现在html文件的任意位置,但建议写在<head></head>之间
js代码和html代码执行的顺序:从上向下依次执行
04。03 js中的注释
js中:
单行注释 :// 快捷键:ctrl+c
多行注释:/ xxxxxx/ 快捷键:ctrl+shift+c
python中:
单行注释:# 快捷键:ctrl+c
多行注释:"""注释文字"""
04.04 js中的变量
定义变量:
使用关键字var
变量的命名规则:
- 可以由数字、字母、下划线、美元符号$组成
- 不能由数字开头
- 不能包含空格和中文
- 不能使用保留字和关键字
- 严格区分大小写,大小写不同会产生不同的变量
- 遵循驼峰原则
04.05 js的数据类型
五大基本数据类型和一种复杂数据类型。
五大基本数据类型:
- Number
- String
- Boolean
- null
- undefined
一种复杂数据类型:
Object
Object分为:
- Function(函数类型)
- Array(类似于python中的列表类型)
- RedExp:正则表达式
注:当定义了一个变量之后,但这个变量没有任何指向,则他的类型就是null
使用typeof操作符判断null获取的结果是Object
undefined:定义一个变量,但是没有赋初始值
NaN:not a Number,不是一个数字
04.06 js中的运算符
算术运算符:
++:自增运算符
--:自减运算符
逻辑运算符:
python中:and(&) or(|) not
js:&& || !
关系运算符(和python中一样):
=:赋值运算符
+=:加等于
-=:
三元运算符:
格式:关系表达式?表达式1[变量1或常量1]:表达式2[变量1或者常量1];
工作原理:如果关系运算符不成立,则返回表达式1的值
==和===之间的区别:
==:比较字面值,不关心数据类型
===:比较字面值和数据类型
04.07 js的选择和循环语句
顺序语句,分支语句,循环语句
python中的语句:
分支语句:if,if-else,if-elif-else
循环语句:while,for-in
js中的语句:
分支语句:if,if-else,if-else-if-else,swith-case
循环语句:while,do-while,for
04.08 if语句
单分支:
if(条件表达式){
满足条件执行的语句
}
双分支语句:
if(条件表达式){
满足条件执行的语句
}else{
不满足条件执行的语句
}
多分支语句:
if(条件表达式){
满足条件执行的语句
}else if(条件表达式2){
满足条件2执行的语句
}else if(....){
满足条件..执行的语句
}else{
不满足条件执行的语句
}
嵌套if:
if(条件表达式){
满足条件1执行的语句
if(条件表达式2){
满足条件2执行的语句
}
}
04.09 swich语句
语法格式:
swich:选择结构
case:满足条件对应的分支
break:swich语句结束
default:默认,如果前面的都没有匹配上就执行这一句
swich表达式:
swich(表达式或者变量){
case 常量值1:{
语句1;
break;
}
case 常量值2:{
语句2;
break;
}
case: 常量值3{
语句3;
break;
}
...
default:{
默认:如果前面的都没有匹配上就执行这一句
}
}
工作原理:可以实现多选一的操作,效果类似于if语句的多分枝
根据表达式或者变量值进行匹配,
如果case分支后面的常量匹配上
从上向下依次进行匹配,当所有的case分支都没有匹配上的时候,则执行default分支
switch案例:
需求:有人加你为好友,如果是女的,欣然同意,男的,拒绝。
代码:
<script type="text/javascript">
var str = "g";
switch (str){
case "b":{
document.write("拒绝");
break;
}
case "g":{
document.write("欣然同意");
break;
}
default:{
document.write("性别不明");
break;
}
}
</script>
04.10while语句
while语句:
while(条件表达式){
循环体
}while(条件表达式)
while和do-while
需求:打印数字1~5
代码:
var num1 = 1;
while (num1 <= 5){
document.write(num1);
num1++;
document.write("<br />")
}
do-while语句:
代码:
var num1 = 1;
do{
document.write(num1);
num1++;
document.write("<br />");
}while(num1<=5);
04.11 for语句
语法:
for(表达式1;表达式2;表达式3){
循环体
}
说明:
表达式1:初始化表达式
表达式2:条件表达式
表达式3:循环结束之后的操作表达式
原理:表达式1--->表达式2---->循环体 ---->表达式3---->表达式2---->循环体----->表达式3.....
其中,表达式1只会被执行依次,表达式2和表达式3会被执行多次[跟while中的用法完全相同]
九九乘法表:
打印九九乘法表:
for (var i=1;i<=9;i++) {
for (var j=1;j<=i;j++) {
document.write(j,"×",i,"=",j*i)
}
document.write("<br />")
}
04 12 break和continue
break:表示跳出循环或者switch语句
a 可以使用在分支语句switch中
b 可以使用在训话中
c continue结束当次循环,继续下一次循环
只能用在循环语句中
04.13 js中的函数
python函数:
方式一:标准写法:
def 函数名(参数列表):
函数体
方式二:匿名函数
add = lambda a,b:a+b
add(2,3)
js中的函数
方式一:使用function关键字
function 函数名(参数列表){
函数体
返回值(可有可无)
}
具有返回值的函数
function add1(a,b,c){
var sum1 = a + b + c;
return sum1;
}
方式二:匿名函数
var 函数名[变量名] = functin(参数列表){
函数体
返回值
}
var add2 = function(a,b){
var sum;
sum = a + b;
return sum;
}
方式三 :动态函数,使用js中内置对象Function[动态函数,使用较少,作为了解]
语法格式:var 函数名[变量名] = new Function(”参数列表“,"函数体和返回值");
var