第三节 深入JavaScript

函数的返回值：（把函数体内的数据传出到函数体外）

　　什么是函数的返回值：函数执行结果、可以没有返回值

　　一种函数应该只返回一种类型的值

函数传参：（与函数返回值相反，把外面数据传入函数体内）

　　可变参（不定参）arguments：参数的个数可变，如参数数组，例如：求所有参数的和、判断arguments.length、给参数取名，增强可读性；　　　　

function sum() {　　//对所有参数求和
　　var result=0;
　　for (var i=0; i<arguments.length; i++){
　　　　result+=arguments[i];
　　}
　　return result;
}
alert(sum(12,4,6,72,8,3,7,4,68,8)); 

//CSS函数
function css(){
　　if (arguments.length==2){ //传入两个参数，表示获取元素
　　　　return arguments[0].style[arguments[1]];
　　}else{ //传入三个参数，表示修改元素值
　　　　arguments[0].style[arguments[1]]=arguments[2];
　　}
}
window.onload=function () {
　　var oDiv=document.getElementById('div1');
　　//alert(css(oDiv,'width'));
　　css(oDiv, 'background', 'green')
};

<div id="div1" style="width:200px; height:200px; border:1px solid black; background:red"></div>

//上面代码可以修改为：
function css(obj, name, value){
　　if (arguments.length==2){ //传入两个参数，表示获取元素
　　　　return obj.style[name];
　　}else{ //传入三个参数，表示修改元素值
　　　　obj.style[name]=value;
　　}
}

 

　　取非行间样式：（上述代码中style只能取行间的样式，而非行间的，或者是外部样式表中的样式都取不了）

　　　　currentStyle用于获取非行间样式或外部样式表中的样式，alert(oDiv.currentStyle.width); 注意：currentStyle只支持IE，Chromee，FF（火狐）不兼容。

　　　　getComputedStyle(对象名, 任何值).样式名，用于火狐、谷歌、IE9以上等浏览器获取行间样式；例如：alert(getComputedStyle(oDiv, false).width);　　　　

//我们要处理这种兼容问题，可以使用以下方法：
　　　　if (oDiv.currentStyle) {
　　　　　　alert(oDiv.currentStyle.width); //IE
　　　　}else {
　　　　　　alert(getComputedStyle(oDiv, false).width); //Chrome、FF
　　　　}

　　　　//或者把上面获取样式封装成一个函数，放入自己的JS文件内，之后只需调用即可
　　　　function getStyle(obj, name) {
　　　　　　if (obj.currentStyle) {
　　　　　　　　return obj.currentStyle[name];
　　　　　　}else {
　　　　　　　　return getComputedStyle(obj, false)[name];
　　　　　　}
　　　　}
　　　　alert(getStyle(oDiv, 'width')); //调用

 　　需要注意的是，上述获取样式的几个方法中有个小缺陷，它们只能获取“单一/简单样式单一/简单样式单一/简单样式单一/简单样式”比如width、height、position……；但是不能获取“复合样式”如background（background-color、background-image……），border（border-color、border-bottom……）等，但是可以取出backgroun-color等这样的单一样式。

数组基础：

　　定义方法：var a=[元素, 元素, 元素, 元素, ...];　　或者var a=new Array(元素, 元素, 元素, 元素, ...);　　两者没有差别，第一种性能略高，因为代码短。

　　数组的属性：“length”既可以获取，又可以设置；　　例如：快速清空数组，只需arr.length=0;

　　数组中应该只存一种类型的变量；

　　数组的方法：

　　　　添加：push(元素)  从尾部添加数据；　　unshift(元素)  从头部添加数据；　　从中间插入：arr.splice(开始, 长度, 元素...)  先删除，后插入，即表示用“元素...”替换被删除的元素，当被删除元素个数，即“长度”为0时，表示直接插入。

　　　　删除：pop()  从尾部弹出数据；　　shift()  从头部弹出数据；　　从中间删除：arr.splice(开始，长度)

　　　　排序：sort([比较函数]);  给一个数组排序，

　　　　　　arr=['array', 'flaot', 'left', 'zoo', 'zero', 'ten', 'mom'];　　arr.sort();：排序一个字符串数组（按首字母在26个因为字母中的先后顺序，相同时继续比较下一个字母）；

　　　　　　arr=[11, 56, 35, 980, 45];　　arr.sort();：排序一个数字数组（按数字的首位在0,1,2,3,4,5,6,7,8,9的顺序）。

　　　　　　怎么解决上句数字不能按大小排序呢？　　　　　　

　　　　　　arr.sort(function (n1, n2) {
　　　　　　　　if (n1<n2){
　　　　　　　　　　return -1;
　　　　　　　　} else if (n1>n2){
　　　　　　　　　　return 1;
　　　　　　　　} else { //n1=n2
　　　　　　　　　　return 0;
　　　　　　　　}
　　　　　　});

　　　　　　//或者把上述语句简写为：

　　　　　　arr.sort(function (n1, n2) {
　　　　　　　　return n1-n2;
　　　　　　});

 

　　　　转换类：数组1.concat(数组2);  连接两个数组； 　　arr.join(分隔符)用分隔符，组合数组元素，生成字符串----对应字符串split