-
常見(jiàn)函數(shù)的四種類(lèi)型有哪些
匿名函數(shù):優(yōu)點(diǎn)占用內(nèi)存空間小
回調(diào)函數(shù):ajax
小遞歸函數(shù):
構(gòu)造函數(shù):
查看全部 -
三種事件綁定的異同
◆htm事件
◆dom0級(jí)事件
◆dom2級(jí)事件
<body>
< input type=" button" value="htm事件點(diǎn)擊" onclick="fun()"丬r
input type=" button" value="dome級(jí)事件"id="btn"
input type=" button" value="dom2級(jí)事件"id="btn1">
<script>
/// JAvascript: ECMAScript DOM +BOM DOMe DOM1 DOM2
//狹義] avascript: ECMAScript ES6Es5Es3
/1、htm1事件
function fun (){
alert("hello Mooc")
}
2、dom級(jí)事件:事件綁定
document. getElementById(btn").onclick= function(){
alert('hello MOOC2')}?
//3、dom2級(jí)事件:事件監(jiān)聽(tīng)
//element.addEventListener(event,function,useCapture)removeEventListener
//event:(必需)事件名,支持所有DOM事件。
//function:(必需)指定要事件觸發(fā)時(shí)執(zhí)行的函數(shù)。
//useCapture:(可選)指定事件是否在捕獲或冒泡階段執(zhí)行。true,捕獲。false,冒泡。默認(rèn)false
//IE8:element.attachEvent(event,function)
//event:(必需)事件類(lèi)型。需加“on“,例如:onclick。
//function:(必需)指定要事件觸發(fā)時(shí)執(zhí)行的函數(shù)。
document.getElementById("btn1").addEventListener("click",fun2);
function fun2(){
alert('hello MOOC3')
}
/事件監(jiān)聽(tīng)的優(yōu)點(diǎn):可以綁定多個(gè)事件;常規(guī)的事件綁定只執(zhí)行最后綁定的事件
//js不支持事件重載,綁定事件相當(dāng)于一個(gè)變量存儲(chǔ)的是函數(shù)的地址,如果再綁定一個(gè)事件,相當(dāng)于變量指向另一個(gè)函數(shù)的地址;事件監(jiān)聽(tīng)相當(dāng)于訂閱發(fā)布者,改變了數(shù)據(jù),觸發(fā)了事件,訂閱這個(gè)事件的函數(shù)被執(zhí)行
查看全部 -
1.在瀏覽器中輸入ur1,交給DNs域名解析,找到P,向服務(wù)器發(fā)起請(qǐng)求;(里面還有緩存ht協(xié)議,TcP,
2.服務(wù)器返回?cái)?shù)據(jù),瀏覽器接收文件(htm1, css,Js,ing..),二進(jìn)制文件
htm1:二進(jìn)制轉(zhuǎn)換為htm1
構(gòu)建Dom樹(shù):HTML解析器
Token ->Node->DOM
Token詞法解析,根是“ document”對(duì)象
Node: HTMLDivElement
DoM:DoM和標(biāo)簽基本是一一對(duì)應(yīng)的關(guān)系div
解析過(guò)程中:
1.遇到1ink的外部css,遇到css的代碼會(huì)進(jìn)行css加載,并行
2遇見(jiàn) script標(biāo)簽的時(shí)候,會(huì)先去執(zhí)行js的內(nèi)容,直至腳本完成執(zhí)行,然后繼續(xù)構(gòu)建DoM;
底部引入 javascript代碼的原因。或者說(shuō)可以在頭部引用,但是前提是加上 async、 defer,或
window. onload;
解析器遇到設(shè)置了 async屬性的 script時(shí),開(kāi)始下載腳本并繼續(xù)解析文檔。腳本會(huì)在它下載完成后盡
快執(zhí)行,但是解析器不會(huì)停下來(lái)等它下載
如果 script標(biāo)簽設(shè)置了該屬性,則瀏覽器會(huì)異步的下載該文件并且不會(huì)影響到后續(xù)Do網(wǎng)的渲染
如果有多個(gè)設(shè)置了 defer的 script標(biāo)簽存在,則會(huì)按照順序執(zhí)行所有的 script
defer腳本會(huì)在文檔渲染完畢后, DOMContentloaded事件調(diào)用前執(zhí)行;腳本會(huì)被延遲到整個(gè)頁(yè)面都解析完畢后再運(yùn)行
構(gòu)建css樹(shù):CSs解析器 index.css
每個(gè)Css文件解析為樣式表對(duì)象 CSSStyleSheet,每個(gè)對(duì)象都包含 CSSRule; CSSRule包含選擇器和聲明對(duì)象,以及其他與CSS語(yǔ)法對(duì)應(yīng)的對(duì)象
Token解析:css的詞法及語(yǔ)法文法
Node->CSSOM
構(gòu)建 render:渲染樹(shù)=DOM樹(shù)+css樹(shù)
布局layout與繪制 paint:計(jì)算對(duì)象之間的大小,距離確定每個(gè)節(jié)點(diǎn)在屏幕上的確切坐標(biāo):映射瀏覽器屏幕繪制;使用UI后端層繪制每個(gè)節(jié)點(diǎn)
reflow(回流):當(dāng)元素屬性發(fā)生改變且影響布局時(shí)(寬度、高度、內(nèi)外邊距等),產(chǎn)生回流,相當(dāng)于
刷新貞面
repaint(重繪);當(dāng)元素屬性發(fā)生改變且不影響布局時(shí)(背景顏色、透明度、字體樣式等),產(chǎn)生重
繪,相當(dāng)于不刷新頁(yè)面,動(dòng)態(tài)更新內(nèi)容
重繪不一定引起回流,回流必將引起重繪
查看全部 -
帶你深入理解棧和隊(duì)列
什么是棧和隊(duì)列
push、pop、unshift、shift方法
//棧是一種后進(jìn)先出的數(shù)據(jù)結(jié)構(gòu),也就是說(shuō)最新添加的項(xiàng)最早被移出;LIFO(Last-In-First-Out,后進(jìn)先出)
//隊(duì)列數(shù)據(jù)結(jié)構(gòu)的訪(fǎng)問(wèn)規(guī)則是FIFO(Fist-In-First-Out,先進(jìn)先出)。隊(duì)列在列表的末端添加項(xiàng),從列表的前端移除項(xiàng)
結(jié)尾出入棧 不影響原有的數(shù)據(jù)位置索引 --- 效率高? push(num), arr.pop();
開(kāi)頭出入棧影響原有的數(shù)據(jù)位置索引---效率低 unshift(num),arr.shift();
查看全部 -
//裝箱:把基本數(shù)據(jù)類(lèi)型轉(zhuǎn)化為對(duì)應(yīng)的引用數(shù)據(jù)類(lèi)型的操作;
//var num=123//number
// var objNum = new Number(123)// obejct
//console.log(typeof objNum)//null
//拆箱:將引用類(lèi)型對(duì)象轉(zhuǎn)換為對(duì)應(yīng)的值類(lèi)型對(duì)象;
//valueof()
// var objNum = new Number(123)
//console.log(typeof objNum.valueof())//123 number
// js toPrimitive(input,type)input:傳入的值type:值類(lèi)型
//1.input判斷是不是原始類(lèi)型的值:是直接返回
//2.不是:|input.valueof():是原始類(lèi)型;直接返回
//3.還不是:input.toString():string是原始類(lèi)型返回
//4.報(bào)錯(cuò)
//valueof():input原始類(lèi)型的值;有:返回,沒(méi)有;返回對(duì)象本身
//tostring():input字符串轉(zhuǎn)換;對(duì)象:[object type]type:對(duì)象類(lèi)型
//面試題
console.log([]+[])//"+toPrimitive()
console.log([].valueof())//
查看全部 -
js中常見(jiàn)的內(nèi)置對(duì)象有哪些?
三種包裝對(duì)象:String、Number、Boolean
其他常用的標(biāo)準(zhǔn)內(nèi)置對(duì)象:Array、Date、Function、Object...
查看全部 -
json.parse(json.stringfy(obj))
查看全部 -
遍歷賦值,淺拷貝
查看全部 -
棧:計(jì)算機(jī)為原始類(lèi)型開(kāi)辟的一塊內(nèi)存空間 :string number,...
堆:計(jì)算機(jī)為引用類(lèi)型開(kāi)辟的一塊內(nèi)存空間:object
查看全部 -
阻止默認(rèn)時(shí)間
?
查看全部 -
編碼和解碼
查看全部 -
排序
查看全部 -
DOM樹(shù)加載
在瀏覽器中輸入url,交給DNS域名解析,找到IP,向服務(wù)器發(fā)起請(qǐng)求;
構(gòu)建DOM樹(shù)和css樹(shù)
構(gòu)建render樹(shù)
重繪/回流
查看全部 -
new執(zhí)行過(guò)程
查看全部 -
Function對(duì)象上的方法:call、apply、bind
類(lèi)數(shù)組不具備數(shù)組的方法
因此,可以進(jìn)行類(lèi)數(shù)組轉(zhuǎn)數(shù)組
var arr=Array.prototype.slice.apply(arguments)
apply和call方法,能劫持另外一個(gè)對(duì)象的方法,繼承另外一個(gè)對(duì)象的屬性
查看全部
舉報(bào)