脚本语言
什么是脚本语言
脚本语言是为了缩短传统的编写-编译-链接-运行(edit-compile-link-run)过程而创建的计算机编程语言
脚本语言的特点
1、脚本语言(JavaScript,VBscript等)不能独立使用,必须介于HTML和C,C++,Java,C#等编程语言之间。
2、脚本语言与编程语言也有很多相似地方,其函数与编程语言比较相像一些,其也涉及到变量。
与编程语言之间最大的区别是编程语言的语法和规则更为严格和复杂一些.
3、与程序代码的关系:脚本也是一种语言,其同样由程序代码组成。
4、脚本语言是一种解释性的语言,例如Python、vbscript,javascript等等,它不像其他语言可以编译成二进制代码,
以可执行文件的形式存在,脚本语言不需要编译,可以直接用,由解释器来负责解释。
5、脚本语言一般都是以文本形式存在,类似于一种命令。
优点:
快速开发:脚本语言极大地简化了“开发、部署、测试和调试”的周期过程。
容易部署:大多数脚本语言都能够随时部署,而不需要耗时的编译/打包过程。
JavaScript
什么是JavaScript
JavaScript 是互联网上最流行的脚本语言,这门语言可用于 HTML 和 web,更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。
JavaScript的特点
JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。
JavaScript 很容易学习。
Javascript注释
单行注释以 // 开头。
多行注释以 /* 开始,以 */ 结尾。
编写位置
三种形式
1、可以将脚本程序代码作为某个元素的事件属性值或超链接的href属性。
2、 内部:Html网页的<body></body>
中;
Html网页的<head></head>
中;
3、外部:外部JS文件里。
注意:html页面加载顺序是顺序加载,也就是说,如果将js写在header
中,js加载完成后body
页面还未加载完成,一些功能可能就实现不了,可以将需要等页面加载完毕后才能使用的js放到body
标签后面,或者给js标签添加一个属性
ps:DOM文档加载步骤:
1.解析HTML结构
2.加载外部的脚本和样式文件
3.解析并执行脚本代码
4.执行$(function(){})内对应代码
5.加载图片等二进制资源
6.页面加载完毕,执行window.onload
在浏览器渲染页面之前,它需要通过解析HTML标记然后构建DOM树。在这个过程中,如果解析器遇到了一个脚本(script),它就会停下来,并且执行这个脚本,然后才会继续解析HTML。如果遇到了一个引用外部资源的脚本(script),它就必须停下来等待这个脚本资源的下载,而这个行为会导致一个或者多个的网络往返,并且会延迟页面的首次渲染时间。
还有一点是需要我们注意的,那就是外部引入的脚本(script)会阻塞浏览器的并行下载,HTTP/1.1规范表明,浏览器在每个主机下并行下载的组件不超过两个(也就是说,浏览器一次只能够同时从同一个服务器加载两个脚本);如果你网站的图片是通过多个服务器提供的,那么按道理来说,你的网站可以一次并行下载多张图片。但是,当我们网站在加载脚本的时候;浏览器不会再启动任何其它的下载,即使这些组件来自不同的服务器。
划重点了啊
对于支持使用script标签的async和defer属性的浏览器,我们可以使用这两个属性;其中需要注意的点就是,async表示的意思是异步加载JavaScript文件,它的下载过程可以在HTML的解析过程中进行,加载完成之后立即执行这个文件的代码,执行文件代码的过程中会阻塞HTML的解析,它不保证文件加载的顺序。defer表示的意思是在HTML文档解析之后在执行加载完成的JavaScript文件,JavaScript文件的下载过程可以在HTML的解析过程中进行,它是按照script标签的先后顺序来加载文件的。
变量
变量的命名
变量的命名:
变量名必须以字母或下划线 (_) 开头
变量名可以包含数字,但是不能以数字开头
由于JavaScript区分大小写,所以可用的字母包括A到Z(大写)和a到z(小写)的字符
不能使用JavaScript的关键字保留字
(和java命名规则差不多)
变量数据类型
在js中一共有六种数据类型
- – 字符串型(String)
- – 数值型(Number)
- – 布尔型(Boolean)
- – null型(Null):表示一个空对象
- – undefined型(Undefined):未定义
- -object 对象
其中String Number Boolean Null undefind 属于基本数据类型
object属于引用数据类型
定义变量、初始化、赋值
定义变量、初始化、赋值
1.定义变量
关键字:var
例:var num;
也可以同时声明多个变量,各个变量之间用逗号隔开。
2.初始化变量
在定义变量的时候,就给值 如:var num=1;
3.给变量赋值
(1)定义变量: var username;
(2)变量赋值: username=“张三”;
js是一种弱类型语言,在定义变量的时候,不需要指定变量的明确类型,统一用var定义。
弱类型一个变量可以重新赋值为另一个类型的变量
typeof可以检查一个变量具体是什么类型
语法:typeof 变量
例:alert(typeof num);
对象
在 JavaScript 中,对象是拥有属性和方法的数据(数据圈起来,要考)。
JavaScript 中的几乎所有事物都是对象:字符串、数字、数组、日期、函数,等等。
例:var message=“Hello World!”
实际上已经创建了一个JavaScript字符串的对象,字符串对象拥有内建的属性length。length=5
属性:txt.length=5;
方法:txt.indexof()
txt.replace()
var person={}//这就创建对象,只是对象为null
var car={
name:"小包",//每个属性方法之间用逗号隔开
brand:"五菱宏光",
price:"500万",
width:"12米",
//行为
show:function(){
alert("姓名:"+this.name+",品牌:"+this.brand);
}//最后一个不要加逗号
}
//调用方法:car.show();
//在一个对象里面可以包含里一个对象
var person1={
name:"wangxiaoer",
mycar:car,//这个car就是上文中的car,整片代码可以连在一起
msg:function(){
alert("aaaaa");
}
}
//给属性赋值第一种
person1.name = "汪达尔";
//第二种方式
person1["name"]="张三";
ps:也就是提取值的方式
//创建对象的另一种方式
var person2 =new Object();
person2.age1 = 10;//创建对象的一个属性
document.write(person2.age1);
数组
数组也是一个对象,可以保持多个值,多个对象
1、创建数组
1、声明一个数组
var scores=new Array();
scores[0]=20;
scores[1]=30;
scores[2]=40;
2、声明一个数组的第二种方式,在声明一个数组的同时赋值
var scores1=new Array(20,30,40,60);
注:如果是单个数字,不是赋值,而是指定的数组的长度
var scores3=new Array(20);
document.writeln("scores3数组的长度是:"+scores3.length+"<br/>");//结果是20;
3、使用最简单的方式创建数组
var scores2=[20,30,50,79];
2、访问数组
1、遍历的方法
for(var i=0; i<arr1.length;i++){
document.write(arr1[i]+" ");
}
划重点
for in 方法
for (var num in arr1) {
alert(num);
document.write(arr1[num]+" ");
}
//for in 方法格式如上,中间的num就是定义的变量,是自动获取的数组的下标(你可以
使用),arr1是你需要遍历的数组
假如有一个由多个对象组成的数组
遍历如下:
for(var i=0; i<arr2.length;i++){
document.write(arr2[i].name+" "+arr2[i]["price"]+"<br/>");
};
write里面的两种取值方法是一样的,这里是为了好玩
3、数组的常用操作
push():向数组中追加元素,添加到末尾,可以追加多个
var arr=[1,2];
arr.push(3,4);
document.write("追加后数组:"+arr+"<br/>");
pop(): 删除的是数组的最后一个元素
arr.pop();
document.write("删除后数组:"+arr+"<br/>");
还有其他操作数组的方法,用其他方法的时候要注意,数组的下标的变化
结束我的回合:gg