函数
函数就是重复执行的代码片。
1、函数定义与执行
<script type="text/javascript">
// 函数定义
function aa(){
alert('hello!');
}
// 函数执行
aa();
</script>
2、变量与函数预解析
JavaScript 解析过程分为两个阶段,先是编译阶段,然后执行阶段,在编译阶段会将 function 定义的函数提前,并且将 var 定义的变量声明提前,将它赋值为 undefined。
<script type="text/javascript">
aa(); // 弹出 hello!
alert(bb); // 弹出 undefined
function aa(){
alert('hello!');
}
var bb = 123;
</script>
3、提取行间事件
在 html 行间调用的事件可以提取到 javascript 中调用,从而做到结构与行为分离。
<!--行间事件调用函数 -->
<script type="text/javascript">
function myalert(){
alert('ok!');
}
</script>
......
<input type="button" name="" value="弹出" onclick="myalert()">
<!-- 提取行间事件 -->
<script type="text/javascript">
window.onload = function(){
var oBtn = document.getElementById('btn1');
oBtn.onclick = myalert;
function myalert(){
alert('ok!');
}
}
</script>
......
<input type="button" name="" value="弹出" id="btn1">
4、匿名函数
定义的函数可以不给名称,这个叫做匿名函数,可以将匿名函数直接赋值给元素绑定的事件来完成匿名函数的调用。
<script type="text/javascript">
window.onload = function(){
var oBtn = document.getElementById('btn1');
// 直接将匿名函数赋值给绑定的事件
oBtn.onclick = function (){
alert('ok!');
}
}
</script>
<input type="button" name="" value="弹出" id="btn1">
5、函数传参
<script type="text/javascript">
function myalert(a){
alert(a);
}
myalert(12345);
</script>
6、函数return
关键字
函数中return
关键字的作用:
1、返回函数执行的结果
2、结束函数的运行
3、阻止默认行为
<script type="text/javascript">
function add(a,b){
var c = a + b;
return c;
alert('here!');
}
var d = add(3,4);
alert(d); // 弹出7
</script>
数组及操作方法
数组就是一组数据的集合,javascript中,数组里面的数据可以是不同类型的。
1、定义数组的方法
//对象的实例创建
var aList = new Array(1,2,3);
//直接量创建
var aList2 = [1,2,3,'asd'];
2、操作数组中数据的方法
1、获取数组的长度:aList.length
;
2、用下标操作数组的某个数据:aList[0]
;
3、join()
将数组成员通过一个分隔符合并成字符串
4、push()
和 pop()
从数组最后增加成员或删除成员
5、unshift()
和 shift()
从数组前面增加成员或删除成员
6、reverse()
将数组反转
7、indexOf()
返回数组中元素第一次出现的索引值
8、splice()
在数组中增加或删除成员
3、多维数组
多维数组指的是数组的成员也是数组的数组。
var aList = [[1,2,3],['a','b','c']];
alert(aList[0][1]); //弹出2;
4、数组去重
var aList = [1,2,3,4,4,3,2,1,2,3,4,5,6,5,5,3,3,4,2,1];
var aList2 = [];
for(var i=0;i<aList.length;i++){
if(aList.indexOf(aList[i])==i){
aList2.push(aList[i]);
}
}
alert(aList2);
5、获取元素的第二种方法
document.getElementsByTagName('')
,获取的是一个选择集,也是数组,但是可以用下标的方式操作选择集里面的dom元素。