1. 函數(shù)傳參
函數(shù)：是由 事件驅(qū)動(dòng) 或者 被調(diào)用時(shí) 執(zhí)行 可重復(fù)使用的 代碼塊
形參：在 函數(shù)體內(nèi) 可以有多個(gè) 形參 沒(méi)有特定的值
實(shí)參：是具體的值态秧，或者變量，或者數(shù)組字符串等等
1.形參和實(shí)參需要一一對(duì)應(yīng)
function 函數(shù)名(形參列表){
函數(shù)體
return 返回值
}
實(shí)參：是具體的值眶明，或變量艾扮，數(shù)組既琴，字符串等
函數(shù)調(diào)用時(shí)，在括號(hào)里寫(xiě)進(jìn)去的參數(shù)
形參：是在函數(shù)定義時(shí)在括號(hào)里設(shè)定的參數(shù)
在函數(shù)體內(nèi)可以有多個(gè)
2.arguments可變參數(shù)數(shù)組
在函數(shù)定義的內(nèi)部泡嘴，有一個(gè)數(shù)組甫恩，arguments會(huì)接受函數(shù)調(diào)用的時(shí)候所有的實(shí)參，并按照從左到右的順序排列酌予，因此磺箕，在js函數(shù)中形參可以與實(shí)際參數(shù)個(gè)數(shù)不同，通過(guò)arguments數(shù)組可以實(shí)現(xiàn)實(shí)參的調(diào)用
在函數(shù)定義的時(shí)候抛虫，如果內(nèi)部沒(méi)有arguments滞磺，則形參和實(shí)參必須一一對(duì)應(yīng)，有arguments的時(shí)候莱褒，可以省略形參击困，因?yàn)閍rguments會(huì)將所有的實(shí)參接收為一個(gè)數(shù)組
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. 形參的默認(rèn)值
函數(shù)有時(shí)候在特殊情況下，可以給形參加上默認(rèn)值广凸，有默認(rèn)值時(shí)阅茶，函數(shù)調(diào)用，可以不寫(xiě)參數(shù)
function rand(min = '0', max = '100') {
return Math.round(Math.random() * (max - min) + min)
}
console.log(rand());
3. 變量的作用域
變量通常在兩個(gè)位置被聲明：
函數(shù)內(nèi) 局部變量 只能在定義的函數(shù)內(nèi)被訪問(wèn)
函數(shù)外 全局變量 可以在程序的各個(gè)位置被訪問(wèn)
通過(guò)var關(guān)鍵字來(lái)定義變量
如果局部變量和全局變量重名谅海，函數(shù)執(zhí)行時(shí)訪問(wèn)局部變量
4. 函數(shù)的嵌套
在函數(shù)的內(nèi)部脸哀，去使用另外一個(gè)函數(shù)
函數(shù)的嵌套中，如果被嵌套的函數(shù)有參數(shù)扭吁，則外層函數(shù)需要跟被嵌套函數(shù)參數(shù)一一對(duì)應(yīng)
5. 變量作用域的污染
當(dāng)變量命名重復(fù)時(shí)撞蜂，程序運(yùn)行的過(guò)程中盲镶，就可能會(huì)出錯(cuò)
使用全局變量時(shí)，如果全局變量在多處聲明蝌诡，后聲明的會(huì)覆蓋先聲明的語(yǔ)句溉贿，造成變量無(wú)法區(qū)分，這種情況稱為變量的污染
解決變法：利用函數(shù)來(lái)分割作用域浦旱，來(lái)進(jìn)行文件中變量作用域的分割
var qqq = 0;
(function (o) {
console.log(1);
var qwe = 100;
var qqq = 1;
console.log(qqq);
})(0);
6. 函數(shù)的執(zhí)行方式
事件綁定和調(diào)用:
1.行間事件的綁定宇色，本質(zhì)上是一個(gè)無(wú)返回值的函數(shù)的調(diào)用
<div class="box" onclick="fn(200)"></div>
2.函數(shù)內(nèi)部this關(guān)鍵字，永遠(yuǎn)指向函數(shù)的調(diào)用對(duì)象
3.行間事件中颁湖，調(diào)用對(duì)象是標(biāo)簽本身宣蠕，所有l(wèi)og(this)輸出的是標(biāo)簽
4.當(dāng)函數(shù)直接調(diào)用的時(shí)候，調(diào)用方式是window對(duì)象甥捺，而一般情況下抢蚀，window對(duì)象自動(dòng)省略，
7. 函數(shù)的幾種形式
1.無(wú)參無(wú)返回值
2.有參有返回值
3.無(wú)參有返回值
4.有參無(wú)返回值
8. 函數(shù)定義方法
1.字面量形式
必須在變量聲明后使用函數(shù)镰禾，在變量沒(méi)有聲明前不能使用（undefined）皿曲，
var fn=function(){}
2.函數(shù)名
聲明一個(gè)函數(shù)，可以在任何地方調(diào)用
function fn(){}
3.自調(diào)用函數(shù)
匿名函數(shù)
自己調(diào)用自己羡微，立即執(zhí)行谷饿，但是只執(zhí)行一次
(function(形參列表){
函數(shù)體
})(實(shí)參列表);
(function (w){
console.log(w);
})(3);
9. 函數(shù)
定義：由事件驅(qū)動(dòng)的或者當(dāng)它被調(diào)用時(shí)執(zhí)行的可重復(fù)使用的代碼塊
同一段代碼在多處出現(xiàn)，成為代碼冗余妈倔，維護(hù)不便博投，函數(shù)就是代碼中封裝復(fù)用的思想，將一塊重復(fù)執(zhí)行的代碼盯蝴，通過(guò)一個(gè)標(biāo)識(shí)符來(lái)代替毅哗，實(shí)現(xiàn)在一個(gè)地方定義，在多處使用的效果捧挺，方便維護(hù)
//事件驅(qū)動(dòng)
div1.onclick = function () {
// 被調(diào)用
function rand() { }
函數(shù)使用（包含兩個(gè)過(guò)程）
1.函數(shù)的定義
function 函數(shù)名(形參列表){
函數(shù)體
return 返回值
}
2.調(diào)用
回調(diào)函數(shù)：將函數(shù)作為參數(shù)傳遞到另外的函數(shù)中執(zhí)行,一般情況下虑绵，回調(diào)函數(shù)必伴隨著分支語(yǔ)句
function c(callback) {
console.log(callback);
}
c(function d() {
return 1;
});
遞歸函數(shù)：函數(shù)在內(nèi)部調(diào)用自身本身,必須有出口
var f = 0;
function e() {
f++;
if (f > 10) {
return;
} else {
e();
}
}
滾動(dòng)條：
window.onscroll =function(){}
onscroll當(dāng)頁(yè)面滾動(dòng)條被滾動(dòng)時(shí)觸發(fā)
監(jiān)聽(tīng)頁(yè)面滾動(dòng)
被window對(duì)象所調(diào)用
獲取滾動(dòng)條偏移量
滾動(dòng)條偏移量是滾動(dòng)條距離頁(yè)面上邊的距離
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兼容性寫(xiě)法：
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瀏覽器窗口大小發(fā)生變化闽烙，觸發(fā)調(diào)用方法
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);
}
滾動(dòng)條高度 + 當(dāng)前窗口的可見(jiàn)高度 == 頁(yè)面的整體高度
文檔高度翅睛，整個(gè)html加載完后的高度
document.documentElement.offsetHeight
瀏覽器可視區(qū)域高度，是瀏覽器顯示內(nèi)容區(qū)域的大小
document.documentElement.clientHeight
滾動(dòng)條的總長(zhǎng)度
document.documentElement.scrollHeight
offsetHeight=實(shí)際文檔高度
if(文檔的高度<窗口高度){
scrollHeight=clientHeight(窗口高度)
}else{
scroloffsetHeight=實(shí)際文檔高度
if(文檔的高度<窗口高度){
scrollHeight=clientHeight(窗口高度)
}else{
scrollHeight=offsetHeight(文檔高度)
}
