1. 函数传参
函数：是由 事件驱动 或者 被调用时 执行 可重复使用的 代码块
形参：在 函数体内 可以有多个 形参 没有特定的值
实参：是具体的值，或者变量，或者数组字符串等等
1.形参和实参需要一一对应
function 函数名(形参列表){
函数体
return 返回值
}
实参：是具体的值，或变量，数组，字符串等
函数调用时，在括号里写进去的参数
形参：是在函数定义时在括号里设定的参数
在函数体内可以有多个
2.arguments可变参数数组
在函数定义的内部，有一个数组，arguments会接受函数调用的时候所有的实参，并按照从左到右的顺序排列，因此，在js函数中形参可以与实际参数个数不同，通过arguments数组可以实现实参的调用
在函数定义的时候，如果内部没有arguments，则形参和实参必须一一对应，有arguments的时候，可以省略形参，因为arguments会将所有的实参接收为一个数组
function sum() {
var sum = 0;
for (var i = 0; i < arguments.length; i++) {
sum += arguments[i];
}
return sum;
}
console.log(sum(1, 2, 3, 4, 5));
2. 形参的默认值
函数有时候在特殊情况下，可以给形参加上默认值，有默认值时，函数调用，可以不写参数
function rand(min = '0', max = '100') {
return Math.round(Math.random() * (max - min) + min)
}
console.log(rand());
3. 变量的作用域
变量通常在两个位置被声明：
函数内 局部变量 只能在定义的函数内被访问
函数外 全局变量 可以在程序的各个位置被访问
通过var关键字来定义变量
如果局部变量和全局变量重名，函数执行时访问局部变量
4. 函数的嵌套
在函数的内部，去使用另外一个函数
函数的嵌套中，如果被嵌套的函数有参数，则外层函数需要跟被嵌套函数参数一一对应
5. 变量作用域的污染
当变量命名重复时，程序运行的过程中，就可能会出错
使用全局变量时，如果全局变量在多处声明，后声明的会覆盖先声明的语句，造成变量无法区分，这种情况称为变量的污染
解决变法：利用函数来分割作用域，来进行文件中变量作用域的分割
var qqq = 0;
(function (o) {
console.log(1);
var qwe = 100;
var qqq = 1;
console.log(qqq);
})(0);
6. 函数的执行方式
事件绑定和调用:
1.行间事件的绑定，本质上是一个无返回值的函数的调用
<div class="box" onclick="fn(200)"></div>
2.函数内部this关键字，永远指向函数的调用对象
3.行间事件中，调用对象是标签本身，所有log(this)输出的是标签
4.当函数直接调用的时候，调用方式是window对象，而一般情况下，window对象自动省略，
7. 函数的几种形式
1.无参无返回值
2.有参有返回值
3.无参有返回值
4.有参无返回值
8. 函数定义方法
1.字面量形式
必须在变量声明后使用函数，在变量没有声明前不能使用（undefined），
var fn=function(){}
2.函数名
声明一个函数，可以在任何地方调用
function fn(){}
3.自调用函数
匿名函数
自己调用自己，立即执行，但是只执行一次
(function(形参列表){
函数体
})(实参列表);
(function (w){
console.log(w);
})(3);
9. 函数
定义：由事件驱动的或者当它被调用时执行的可重复使用的代码块
同一段代码在多处出现，成为代码冗余，维护不便，函数就是代码中封装复用的思想，将一块重复执行的代码，通过一个标识符来代替，实现在一个地方定义，在多处使用的效果，方便维护
//事件驱动
div1.onclick = function () {
// 被调用
function rand() { }
函数使用（包含两个过程）
1.函数的定义
function 函数名(形参列表){
函数体
return 返回值
}
2.调用
回调函数：将函数作为参数传递到另外的函数中执行,一般情况下，回调函数必伴随着分支语句
function c(callback) {
console.log(callback);
}
c(function d() {
return 1;
});
递归函数：函数在内部调用自身本身,必须有出口
var f = 0;
function e() {
f++;
if (f > 10) {
return;
} else {
e();
}
}
滚动条：
window.onscroll =function(){}
onscroll当页面滚动条被滚动时触发
监听页面滚动
被window对象所调用
获取滚动条偏移量
滚动条偏移量是滚动条距离页面上边的距离
document.body.scrollTop--chrome支持(低版本)
document.documentElement.scrollTop--Chrome、firefox支持
window.pageYOffset safari支持
window.pageXOffset
window.onscroll = function () {
var y = document.documentElement.scrollTop;
console.log(y);
var x = document.documentElement.scrollLeft;
console.log(x);
}
onscroll兼容性写法：
function scrol() {
// 普通方法
var scrollTop = document.documentElement.scrollTop ||
document.body.scrollTop || window.pageYOffset;
var scrollLeft = document.documentElement.scrollLeft ||
document.body.scrollLeft || window.pageXOffset;
return [scrollTop, scrollLeft];
// 使用json字符串方法
var scroll={
y:document.documentElement.scrollTop ||
document.body.scrollTop || window.pageYOffset,
x:document.documentElement.scrollLeft ||
document.body.scrollLeft || window.pageXOffset,
}
return scroll;
}
window.onscroll = function () {
// console.log(scrol()[0], scrol()[1]); 普通方法输出
console.log(scrol().y,scrol().x); //json输出
}
// window.onresize浏览器窗口大小发生变化，触发调用方法
window.onresize=function(){
// console.log(document.documentElement.offsetWidth);
console.log(document.documentElement.offsetHeight);
console.log(document.documentElement.clientHeight);
console.log(document.documentElement.scrollHeight);
document.documentElement.scrollTop=500;
console.log(document.documentElement.scrollTop);
}
滚动条高度 + 当前窗口的可见高度 == 页面的整体高度
文档高度，整个html加载完后的高度
document.documentElement.offsetHeight
浏览器可视区域高度，是浏览器显示内容区域的大小
document.documentElement.clientHeight
滚动条的总长度
document.documentElement.scrollHeight
offsetHeight=实际文档高度
if(文档的高度<窗口高度){
scrollHeight=clientHeight(窗口高度)
}else{
scroloffsetHeight=实际文档高度
if(文档的高度<窗口高度){
scrollHeight=clientHeight(窗口高度)
}else{
scrollHeight=offsetHeight(文档高度)
}
