1.清除盒模型的浮動方式
way 1: 最后追加元素,
設置 clear:both;
way 2: 偽元素清除
div::after{
clear:both,
content:'',
height:0;
line-height:0;
display:block;
visiablity:hidden;
}
div{
zoom:1; // ie下生效設置或者檢索縮放比例
}
way 3: 父元素增加overflow:hidden;
2.谷歌瀏覽器在標準模式下不支持小于12px的文字娩脾，如何讓它支持小于12px的文字
使用 -webkit-text-size-adjust:none;? 對谷歌的27.0一下版本有效贱呐，27.0以上無效，只支持英文，對英文無效砰琢，新的版本已經(jīng)禁止了修改該屬性胡桨，可以使用transform：scale（0.8） 來進行調整，當然容器也會隨著縮小烫堤，要注意重新調整位置荣赶。
3.火狐下文本無法撐開整個容器高度凤价，如何解決？css hack
div{
height:auto!important;
height:200px;
min-height:200px;
}
4.CSS3新增的選擇器有哪些拔创？
子元素選擇器利诺，相鄰兄弟選擇器，通用兄弟選擇器剩燥，群組選擇器
子元素：? ? 父 > 子
相鄰兄弟：? 元素 + 兄弟
通用兄弟： 元素 ~ 兄弟
群組：? 元素1慢逾，元素2，,,, ,
css3屬性選擇器：
Element[attribute]? ? Element[attribute=”value”]? 可以用通配符? ^ 開頭 $ 結尾 ~ 包含屬性? * 屬性值包含
Element[attribute^=”value”]
css3偽類選擇器：
行為偽類：
:hover? :active(點擊) :focus(input光標選中)
錨點偽類：
:link? :visited
狀態(tài)偽類：
:enabled :disabled? :checked :unchecked
偽元素：
::before? ? 和content配合使用
::after 和content配合使用 多用于清除浮動
::selection? 選中文本的背景色? ie9支持
E:first-child 獲取第一個
E:last-child? 獲取最后一個
E:nth-child(n) 獲取e類型的第幾個后代? 從1開始計數(shù)
E:nth-child(an + b)? 這里的n 代表 從 0 開始灭红，依次遞增的自然數(shù)
E:nth-child(even)
E:nth-child(odd)
:not 否定選擇器
Element::first-line 根據(jù)“first-line”偽元素中的樣式對Element元素的第一行文本進行格式化
Element::first-letter? 用于向文本的首字母設置特殊樣式
Element:nth-last-child(N)? ? 匹配屬于其元素的第N個子元素的每個元素侣滩，不論元素的類型，從最后一個子元素開始計數(shù)
Element:nth-of-last-type(N)? ? 匹配屬于父元素的特定類型的第N個子元素的每個元素变擒，從最后一個子元素開始計數(shù)? 帶著type都是要和選擇器元素的類型相同君珠，child則是直接返回所有子元素
Element:empty? 沒有子節(jié)點的元素
Element:only-child
Element:last-of-type 匹配屬于父元素的特定類型的最后一個子元素的每個元素
Element:first-of-type? 匹配屬于其父元素的特定類型的首個子元素的每個元素
html5新增標簽
aricle:頁面上構建完整并且獨立的內容 如小說，文章娇斑，報道類
aside:用來裝載非正文類的內容 如 廣告 側邊欄
section:標簽定義文檔中的節(jié) 例如小說中的一章
header:頁面頭部?
footer:頁腳
nav:標簽定義顯示導航鏈接
hgroup:標簽用于網(wǎng)頁或區(qū)段
figure>figcaption
<figure>:標簽包含獨立的媒體內容策添，如圖像 圖表 照片等等
<figcaption>標簽定義figure元素的標題（caption）
details>summary
<details>標簽用于描述文檔或文檔某個部分的細節(jié)，而這個細節(jié)并不需要文檔加載時就展示悠菜，而是可以折疊舰攒。
屬性：open定義details是否可見
<summary>默認顯示的details元素的標題
datalist>option
輸入框提示列表 ? ?input的list屬性值為datalist的id
progress :進度條 ?屬性：max:進度完成 value:定義當前進度值
mark:標記需要突出顯示的文本
keygen:表單的密鑰對生成器
權重：
行內樣式（1000）>ID選擇器（100）>類，屬性選擇器和偽類選擇器（10）>元素和偽元素（1）>*（0）
background-origin(指定背景圖片從哪里開始顯示)
box-sizing(控制盒模型的組成模式)
content-box:? 使用此值時, 盒模型的組成模式是, 元素寬度 = content + padding + border;
border-box:? ? 使用此值時, 盒模型的組成模式是, 元素寬度 = content(即使設置了padding和border, 元素的整體寬高不變
5.CSS3動畫animate
關鍵幀(@keyframes)
animation: dropdown 8s linear infinite;
.c:hover{animation: 2s change 3 forwards;}? forwards為保持在結束狀態(tài)
不需要觸發(fā) 可以循環(huán)播放
transition? 0.4s linear background 1s
6.ES6實現(xiàn)數(shù)組去重
1. newarray = [... new Set(oldarray)]
2 .newarray = Array.from(new Set(oldarray))
3 .? function unique(arr) {
const res = new Map();
return arr.filter((a) => !res.has(a) && res.set(a, 1))
}
7.Vue中v-if和v-show的區(qū)別
v-if 直接添加或者刪除整個dom元素
v-show dom渲染出來了? 但是設置了display：none
8.Vue阻止事件冒泡
事件后增加? .stop? 阻止冒泡
.prevent 阻止默認事件
.native? 原生事件綁定到組件
如果原生組件在其他元素的包裹下悔醋，使用摩窃。native方法可能會失效，這是可以使用 this.$listener,v-on="$listeners" 將所有的事件監(jiān)聽器指向這個組件的某個特定的子元素,和計算屬性配合使用芬骄。
Vue.component('base-input', {
? inheritAttrs: false,
? props: ['label', 'value'],
? computed: {
inputListeners: function () {
? var vm = this
? // `Object.assign` 將所有的對象合并為一個新對象
? return Object.assign({},
// 我們從父級添加所有的監(jiān)聽器
this.$listeners,
// 然后我們添加自定義監(jiān)聽器猾愿，
// 或覆寫一些監(jiān)聽器的行為
{
? // 這里確保組件配合 `v-model` 的工作
? input: function (event) {
vm.$emit('input', event.target.value)
? }
}
? )
}
? },
? template: `
<label>
? {{ label }}
? <input
v-bind="$attrs"
v-bind:value="value"
v-on="inputListeners"
? >
</label>
? })
9.Vue的生命周期
beforCreate?
create
beforeMounted
mounted
beforeUpdate
update
beforeDestroy
destroy
10.Vue的watch是怎么運作的
Vue的數(shù)據(jù)雙向綁定有3大核心：Observer,Dep,Watcher
12.實現(xiàn)水平垂直居中
way 1：
對于行級元素或者行級塊元素：display:table-cell和vertical-align、text-align账阻，使父元素內的所有行內元素水平垂直居中（內部div設置display:inline-block即可）蒂秘。這在子元素不確定寬高和數(shù)量時，
對table-cell元素設置百分比（如100%）的寬高值時無效的淘太，但是可以將父元素設置display:table姻僧，再將父元素設置百分比寬高，子元素table-cell會自動撐滿父元素蒲牧。這就可以做相對于整個頁面的水平垂直居中
way2：
div {
position: relative; /* 相對定位或絕對定位均可 */
width:500px;
height:300px;
top: 50%;
left: 50%;
margin: -150px 0 0 -250px;? ? /* 外邊距為自身寬高的一半 */
? }
? way3:
? div {
position: absolute; /* 相對定位或絕對定位均可 */
width:500px;
height:300px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
way4:
? .container {
display: flex;
align-items: center; /* 垂直居中 */
justify-content: center; /* 水平居中 */
}
.container div {
width: 100px;
height: 100px;
}?
13.cookie撇贺、localStore和sessionStore的區(qū)別
共同點：都是保存在瀏覽器端馆里、且同源的
區(qū)別：
1刨秆、cookie數(shù)據(jù)始終在同源的http請求中攜帶（即使不需要），即cookie在瀏覽器和服務器間來回傳遞骂远，而sessionStorage和localStorage不會自動把數(shù)據(jù)發(fā)送給服務器挎扰，僅在本地保存翠订。cookie數(shù)據(jù)還有路徑（path）的概念巢音，可以限制cookie只屬于某個路徑下
2、存儲大小限制也不同尽超，cookie數(shù)據(jù)不能超過4K官撼，同時因為每次http請求都會攜帶cookie、所以cookie只適合保存很小的數(shù)據(jù)橙弱，如會話標識歧寺。sessionStorage和localStorage雖然也有存儲大小的限制燥狰，但比cookie大得多棘脐，可以達到5M或更大
3、數(shù)據(jù)有效期不同龙致，sessionStorage：僅在當前瀏覽器窗口關閉之前有效蛀缝；localStorage：始終有效，窗口或瀏覽器關閉也一直保存目代，因此用作持久數(shù)據(jù)屈梁；cookie：只在設置的cookie過期時間之前有效，即使窗口關閉或瀏覽器關閉
4榛了、作用域不同在讶，sessionStorage不在不同的瀏覽器窗口中共享，即使是同一個頁面霜大；localstorage在所有同源窗口中都是共享的构哺；cookie也是在所有同源窗口中都是共享的
5、web Storage支持事件通知機制战坤，可以將數(shù)據(jù)更新的通知發(fā)送給監(jiān)聽者
6曙强、web Storage的api接口使用更方便
14.get和post的區(qū)別
對于GET方式的請求，瀏覽器會把http header和data一并發(fā)送出去途茫，服務器響應200（返回數(shù)據(jù)）碟嘴； ff瀏覽器發(fā)送一個包? 不管是post還是get
網(wǎng)絡差的時候可以判斷數(shù)據(jù)是否完整。
而對于POST囊卜，瀏覽器先發(fā)送header娜扇，服務器響應100 continue，瀏覽器再發(fā)送data栅组，服務器響應200 ok（返回數(shù)據(jù)）雀瓢。
get參數(shù)通過url傳遞，post放在request body中笑窜。
get請求在url中傳遞的參數(shù)是有長度限制的致燥，而post沒有。
get比post更不安全排截，因為參數(shù)直接暴露在url中嫌蚤，所以不能用來傳遞敏感信息辐益。
get請求只能進行url編碼，而post支持多種編碼方式脱吱。
get會主動cache,請求參數(shù)會被完成的保留到瀏覽記錄里智政，而post不會。
15.瀏覽器渲染頁面的過程
HTML解析出DOM Tree
CSS解析出Style Rules
將二者關聯(lián)生成Render Tree
Layout 根據(jù)Render Tree計算每個節(jié)點的信息
Painting 根據(jù)計算好的信息繪制整個頁面
Repaint ——屏幕的一部分要重畫箱蝠，比如某個CSS的背景色變了续捂。但是元素的幾何尺寸沒有變。
Reflow 元件的幾何尺寸變了宦搬，我們需要重新驗證并計算Render Tree牙瓢。是Render Tree的一部分或全部發(fā)生了變化。這就是Reflow间校，或是Layout矾克。
發(fā)起請求；
解析HTML憔足；
解析樣式胁附；
執(zhí)行JavaScript；
布局滓彰；
繪制
頁面優(yōu)化：
HTML文檔結構層次盡量少控妻，最好不深于六層；
腳本盡量后放揭绑，放在前即可弓候；
少量首屏樣式內聯(lián)放在標簽內；
樣式結構層次盡量簡單洗做；
在腳本中盡量減少DOM操作弓叛，盡量緩存訪問DOM的樣式信息，避免過度觸發(fā)回流诚纸；
減少通過JavaScript代碼修改元素樣式撰筷，盡量使用修改class名方式操作樣式或動畫；
動畫盡量使用在絕對定位或固定定位的元素上畦徘；
隱藏在屏幕外毕籽，或在頁面滾動時，盡量停止動畫井辆；
盡量緩存DOM查找关筒，查找器盡量簡潔；
涉及多域名的網(wǎng)站杯缺，可以開啟域名預解析
16.CSS怎么渲染的
? 瀏覽器CSS匹配不是從左到右進行查找蒸播，而是從右到左進行查找。
? css樣式規(guī)則渲染是先就近渲染，然后才依據(jù)選擇符權重進行渲染袍榆。
? ：important > 內聯(lián) > ID > 類 > 標簽 | 偽類 | 屬性選擇 > 偽對象 >通配符 > 繼承
瀏覽器下載的順序是從上到下胀屿，渲染的順序也是從上到下，下載和渲染是同時進行的包雀。
在渲染到頁面的某一部分時宿崭，其上面的所有部分都已經(jīng)下載完成（并不是說所有相關聯(lián)的元素都已經(jīng)下載完）。
如果遇到語義解釋性的標簽嵌入文件（JS腳本才写，CSS樣式）葡兑，那么此時IE的下載過程會啟用單獨連接進行下載。
并且在下載后進行解析赞草，解析過程中讹堤，停止頁面所有往下元素的下載。
樣式表在下載完成后房资，將和以前下載的所有樣式表一起進行解析蜕劝，解析完成后，將對此前所有元素（含以前已經(jīng)渲染的）重新進行渲染轰异。
JS、CSS中如有重定義暑始，后定義函數(shù)將覆蓋前定義函數(shù)搭独。
? 渲染效率與下面三點有關：
css選擇器的查詢定位效率
瀏覽器的渲染模式和算法
要進行渲染內容的大小
17.怎么理解原型鏈
object.prototype
18.transition和keyframes的區(qū)別
1：transition需要一個事件來觸發(fā)，比如hover廊镜，所以沒法在網(wǎng)頁加載時自動發(fā)生
2: transition是一次性的牙肝，不能重復發(fā)生，除非一再觸發(fā)嗤朴。
3： transition只能定義開始狀態(tài)和結束狀態(tài)配椭，不能定義中間狀態(tài)，也就是說只有兩個狀態(tài)雹姊。
4：一條transition規(guī)則股缸，只能定義一個屬性的變化，不能涉及多個屬性吱雏。
keyframes 可以定義中間狀態(tài)敦姻，還可以設定是否循環(huán)調用，不需要事件觸發(fā)歧杏。
19. 實現(xiàn)一個方法镰惦，返回一個boolean值，判斷輸入是否為回文犬绒。
str = str.replace(/W/g, '').toLowerCase();? ? ? //將非a-Z0-9-的字符替換為空旺入，轉為小寫字符
return (str == str.split('').reverse().join(''));? //字符串分割 反轉 重新連接 如果等于原先則為true
20.js中的數(shù)據(jù)類型
基本：string 、 number 凯力、 symbol 茵瘾、boolean 急膀、undefined
復雜類型：Object 、 array龄捡、 function
1. undefined:未定義的變量卓嫂，或未賦值的變量，或不存在的變量屬于undefined聘殖；
2. NaN:非數(shù)字類型晨雳，但是NaN屬于number，可用isNaN();來判斷是否屬于非數(shù)字奸腺。NaN不和任何值相等餐禁，包括NaN本身。NaN兩個N大寫突照，中間的a小寫帮非。
3. boolean：布爾值，我們常說的真假讹蘑，真為1末盔，假為0。只有這兩個值座慰。
4. null：空陨舱，屬于object，但是判斷null == undefined時返回true版仔。判斷null === undefined時為false游盲；
21.反轉字符串
1. 使用 Array的reverse()方法
char[] c = original.spilt('');
Array.Reverse(c);
2. 逆序遍歷
3. public static String strReverseWithRecursive(String string){
? ? ? ? if(string==null||string.length()==0)return string;
? ? ? ? int length = string.length();
? ? ? ? if(length==1){
? ? ? ? ? ? return string;
? ? ? ? }else{
? ? ? ? ? ? return? strReverseWithRecursive(string.substring(1))+string.charAt(0);
? ? ? ? }
? ? }
22.用CSS實現(xiàn)三角形
div{
width:0px;
height:0px;
border-left:20px solid transparent;
border-right:20px solid transparent;
border-top:20px solid #000;
border-bottom:0px;
}
23.不使用border，畫個1px的線蛮粮，在標準模式和怪異模式下展示一樣
<divstyle="width:100%;height:1px;background-color:black"></div>
<? hr size="1" > 不太兼容
24.說一下CSS Reset的作用和好處
css? reset的作用就是重置這些默認樣式益缎，使樣式表現(xiàn)一致；
為了讓頁面獲得瀏覽器跨瀏覽器的兼容性然想，需要用重置文件css代碼覆蓋瀏覽器默認的樣式來統(tǒng)一樣式莺奔。
25.什么是BFC，作用是什么又沾？
1. BFC 塊級格式上下文弊仪，浮動元素和絕對定位元素，非塊級盒子的塊級容器（例如 inline-blocks, table-cells, 和 table-captions）杖刷，
以及overflow值不為“visiable”的塊級盒子励饵，都會為他們的內容創(chuàng)建新的BFC（塊級格式上下文）。
2. 生成BFC元素的子元素會一個接一個的放置滑燃。垂直方向上他們的起點是一個包含塊的頂部役听，兩個相鄰子元素之間的垂直距離取決于元素的margin特性。在BFC中相鄰的塊級元素外邊距會折疊。
特點：? 內部的Box會在垂直方向上一個接一個的放置
垂直方向上的距離由margin決定典予。（完整的說法是：屬于同一個BFC的兩個相鄰Box的margin會發(fā)生重疊甜滨，與方向無關。）
每個元素的左外邊距與包含塊的左邊界相接觸（從左向右）瘤袖，即使浮動元素也是如此衣摩。（這說明BFC中子元素不會超出他的包含塊，而position為absolute的元素可以超出他的包含塊邊界）
BFC的區(qū)域不會與float的元素區(qū)域重疊
計算BFC的高度時捂敌，浮動子元素也參與計算
BFC就是頁面上的一個隔離的獨立容器艾扮，容器里面的子元素不會影響到外面元素，反之亦然
看到以上的幾條約束占婉，讓我想起學習css時的幾條規(guī)則
Block元素會擴展到與父元素同寬泡嘴，所以block元素會垂直排列
垂直方向上的兩個相鄰DIV的margin會重疊，而水平方向不會(此規(guī)則并不完全正確)
浮動元素會盡量接近往左上方（或右上方）
為父元素設置overflow：hidden或浮動父元素逆济，則會包含浮動元素
3.產(chǎn)生條件
1).float的值不是none酌予。
2)、position的值不是static或者relative奖慌。
3)抛虫、display的值是inline-block、table-cell升薯、flex莱褒、table-caption或者inline-flex
4)、overflow的值不是visible,
4. 作用
1).阻止垂直外邊距（margin-top涎劈、margin-bottom）折疊
2).包含浮動元素
與浮動元素相鄰的已生成BFC的元素不能與浮動元素相互覆蓋,可以實現(xiàn)左右固定寬度? 中間自適應。? 左右模塊設置浮動阅茶，中間元素設置overflow：hidden
總結一句話：就是垂直方向上的margin會重合
27.Restful的規(guī)范理解
? ? RESTful是一種架構的規(guī)范與約束蛛枚、原則，符合這種規(guī)范的架構就是RESTful架構脸哀。
28.怎么解決瀏覽器的跨域
1. jsonp? 為啥script請求不存在跨域：因為script? link? 和 img? 等請求不受同源策略限制蹦浦，ajax異步請求則受同源策略限制。
2. 后端進行處理? 過濾器中指定可跨域? Access-control-allow-origin
3. document.domain? Cookie是服務器寫入瀏覽器的一段信息撞蜂，只有同源的網(wǎng)頁才能共享盲镶，但是，兩個網(wǎng)頁一級域名相同蝌诡，只是二級域名不同溉贿，瀏覽器允許通過設置document.domain共Cookie。
4. 瀏覽器窗口有window.name屬性浦旱。這個屬性的最大特點是宇色，無論是否同源，只要在同一個窗口里，前一個網(wǎng)頁設置這個屬性宣蠕，后一個網(wǎng)頁就可以讀取它例隆。
29.實現(xiàn)一個方法，傳入一個參數(shù)抢蚀，判斷這個參數(shù)是不是整數(shù)镀层，用運算表達式實現(xiàn)
1. X^0 === X;
2. Math.round(x) === x;? 或者可以使用ceil和floor判斷
3. (typeof x === 'number') && (x % 1 === 0);? ?
注意：? 使用parseInt的時候，存在局限性 當數(shù)值比較大的時候皿曲，數(shù)據(jù)在進行parseInt的時候會轉化為String唱逢，這時會出現(xiàn)科學計數(shù)法即指數(shù)形式，1e+21 這時解析到1以后就不解析了 直接返回1了谷饿。結果錯誤 使用parseInt的時候惶我，存在局限性 當數(shù)值比較大的時候，數(shù)據(jù)在進行parseInt的時候會轉化為String博投，這時會出現(xiàn)科學計數(shù)法即指數(shù)形式绸贡，1e+21 這時解析到1以后就不解析了 直接返回1了。結果錯誤
實現(xiàn)一個方法毅哗，返回一個boolean值听怕，判斷輸入是否為回文。
str = str.replace(/W/g, '').toLowerCase();? ? ? //將非a-Z0-9-的字符替換為空虑绵，轉為小寫字符
return (str == str.split('').reverse().join(''));? //字符串分割 反轉 重新連接 如果等于原先則為true
30.正則
不以 尿瞭。。 開頭? ? ^(?!ab)[a-z]+$? ? 不以ab開頭的字符串
不以 翅睛。声搁。 結尾 ? ^[a-z]+(?<!bc)$? ? 不以bc結尾的字符串
31. 頁面的防抖和節(jié)流
防抖：使用延時處理，基本是使用setTimeOut進行處理捕发。
? ? function debouce(func,delay,immediate){
? ? ? var timer = null;
? ? ? return function(){
? ? ? ? var context = this;
? ? ? ? var args = arguments;
? ? ? ? if(timer) clearTimeout(time);
? ? ? ? if(immediate){
? ? ? ? ? ? //根據(jù)距離上次觸發(fā)操作的時間是否到達delay來決定是否要現(xiàn)在執(zhí)行函數(shù)
? ? ? ? ? ? var doNow = !timer;
? ? ? ? ? ? //每一次都重新設置timer疏旨，就是要保證每一次執(zhí)行的至少delay秒后才可以執(zhí)行
? ? ? ? ? ? timer = setTimeout(function(){
? ? ? ? ? ? ? ? timer = null;
? ? ? ? ? ? },delay);
? ? ? ? ? ? //立即執(zhí)行
? ? ? ? ? ? if(doNow){
? ? ? ? ? ? ? ? func.apply(context,args);
? ? ? ? ? ? }
? ? ? ? }else{
? ? ? ? ? ? timer = setTimeout(function(){
? ? ? ? ? ? ? ? func.apply(context,args);
? ? ? ? ? ? },delay);
? ? ? ? }
? ? }
}
節(jié)流流：節(jié)流函數(shù)允許一個函數(shù)在規(guī)定的時間內只執(zhí)行一次。
節(jié)流和防抖動最大的區(qū)別就是扎酷，節(jié)流函數(shù)不管事件觸發(fā)有多頻繁檐涝，都會保證在規(guī)定時間內一定會執(zhí)行一次真正的事件處理函數(shù)。
節(jié)流時間戳實現(xiàn)：
var throttle = function(func,delay){
? ? var prev = Date.now();
? ? return function(){
? ? ? ? var context = this;
? ? ? ? var args = arguments;
? ? ? ? var now = Date.now();
? ? ? ? if(now-prev>=delay){
? ? ? ? ? ? func.apply(context,args);
? ? ? ? ? ? prev = Date.now();
? ? ? ? }
? ? }
}
節(jié)流定時器實現(xiàn)：
// 簡單的節(jié)流函數(shù)
function throttle(func, wait, mustRun) {
var timeout,startTime = new Date();
return function() {
var context = this,args = arguments,curTime = new Date();
clearTimeout(timeout);
// 如果達到了規(guī)定的觸發(fā)時間間隔法挨，觸發(fā) handler
if(curTime - startTime >= mustRun){
func.apply(context,args);
startTime = curTime;
// 沒達到觸發(fā)間隔谁榜，重新設定定時器
}else{
timeout = setTimeout(func, wait);
}
};
};
32.深度克隆
1.function copyObject(Target,Origin){
var Target = Target||{};
for (const key in Origin) {
//判斷是否是自己的屬性
if (Origin.hasOwnProperty(key)) {
if( Origin[key]!== null &&? typeof(Origin[key]) == "Object"){
if(Object.prototype.toString.call(Origin[key]) == "[Object Array]"){? //call方法表示調用?
Target[key] = [];
}else{
Target[key] = {};
}
copyObject(Target[key],Origin[key]);
}else{
Target[key] = Origin[key];
}
}
}
}
2. 使用object.assign參數(shù)為true時為深拷貝
? 判斷一個對象是array的方法：
? 1. arr instance Array ;
? 2. arr.constructor === Array ? ? 1 2 存在漏洞
? 3. Object.prototype.toString? ? 最嚴謹
33 . transform屬性
功能：該屬性允許我們對元素進行旋轉、縮放凡纳、移動或傾斜窃植。
屬性? translate(x,y)? 按照x y 軸移動距離
? scale(x,y)? ? ? 按照 水平 垂直距離縮放?
? rotate(angle)? ? 按照角度旋轉? 參數(shù)為角度? 360度 為? 2*Math.pi
? skew(x-angle,y-angle)? 按照角度傾斜? ?
? matrix(n,n,n,n,n,n)? 矩陣轉換
34.vuex中mutation需要在methods中調用，值可以在computed中獲取
store中只有mutation是的時候? 不存在action的時候? ?
methods中調用
this.$store.commit(mutation下定義的名稱);?
獲取的時候?
this.$store.state.獲取對象的名稱
存在action的時候? action中執(zhí)行?
? increment(context){
context.commit(mutation中定義的函數(shù));
? },
methods中使用?
this.$store.dispatch(actions下定義的名稱);
獲取的時候?
this.$store.state.獲取對象的名稱
35.css預處理語言
saaa? 變量? $mainColor: #0982c1;? ? 引用? ? color: $publicColor;
less? 變量 @mainColor: #0982c1;? ? 引用? ? color: @publicColor;
stylus Stylus對變量名沒有任何限定惫企，你可以是$開始撕瞧，也可以是任意字符陵叽，
而且與變量值之間可以用冒號、空格隔開丛版，需要注意的是 Stylus (0.22.4) 將會編譯 @ 開始的變量巩掺，但其對應的值并不會賦予該變量，換句話說页畦，在 Stylus 的變量名不要用 @ 開頭胖替。
預處理優(yōu)點：
1.層級關系更明確
2 section {
? margin: 10px;
? nav {
height: 25px;
a {
? color: #0982C1;
? &:hover {
text-decoration: underline;
? }
}
? }
}
36.axios跨域處理：原理為服務器代理
1. 修改config下的index.js 中的
proxyTable: {
? '/api': {
target: 'https://api.douban.com',// 請換成你的地址
changeOrigin: true,
pathRewrite: {
? '^/api': ''
}
? }
}
2 .增加main.js中的Vue.prototype.HOST = '/api'
請求時 路徑就變?yōu)? this.HOST + 后邊地址+參數(shù)
38.created中使用axios加載數(shù)據(jù)? 值放在data中的時候 then方法中使用箭頭函數(shù)?
then的內部不能使用Vue的實例化的this, 因為在內部 this 沒有被綁定。
解決：聲明self? self.users= res.data;或者使用 ES6 的 箭頭函數(shù)arrow function豫缨，箭頭方法可以和父方法共享變量独令。
created() {? ? ? ?
axios.post('http://jsonplaceholder.typicode.com/users'').then((res) => {? ? ? ? ? ?
this.users= res.data;? ? ?
})? ?
},
39.標準模式：瀏覽器按W3C標準解析執(zhí)行代碼。
? 怪異模式：兼容老頁面好芭。使用瀏覽器自己的方式解析執(zhí)行代碼燃箭，因為不同瀏覽器解析執(zhí)行的方式不一樣
① 不存在doctype或形式不正確會導致怪異模式；
② 有過渡/框架dtd沒有URI會導致頁面以怪異模式呈現(xiàn)舍败；
③ IE中招狸，如果doctype聲明在xml之后，會導致怪異模式邻薯。
40.浮動的原理
float 屬性定義元素在哪個方向浮動裙戏。以往這個屬性總應用于圖像，使文本圍繞在圖像周圍厕诡，不過在 CSS 中累榜，任何元素都可以浮動。浮動元素會生成一個塊級框灵嫌，自動增加display：block屬性壹罚，而不論它本身是何種元素
float設置的浮動元素對塊級元素不可見，會覆蓋掉浮動元素寿羞，對文本元素和bfc元素可見渔嚷。
41. Javascript 中函數(shù)聲明和函數(shù)表達式是存在區(qū)別的，函數(shù)聲明在JS解析時進行函數(shù)提升稠曼，因此在同一個作用域內，
不管函數(shù)聲明在哪里定義客年，該函數(shù)都可以進行調用霞幅。而函數(shù)表達式的值是在JS運行時確定，并且在表達式賦值完成后量瓜，該函數(shù)才能調用
42. #main-navigation {? }? ? ? /* ID（最快） */
body.home #page-wrap {? }? /* ID */
.main-navigation {? }? ? ? /* Class */
ul li a.current {? }? ? ? /* Class *
ul {? }? ? ? ? ? ? ? ? ? ? /* Tag */
ul li a {? }? ? ? ? ? ? ? ? /* Tag */
* {? }? ? ? ? ? ? ? ? ? ? /* Universal（慢） */
#content [title='home']? ? /* Universal */
43. property是DOM中的屬性司恳，是JavaScript里的對象；
attribute是HTML標簽上的特性绍傲，它的值只能夠是字符串
property會從attribute中獲取同步扔傅，然而attribute不會從property中獲取同步
attribute（特性）耍共，是我們賦予某個事物的特質或對象。
property（屬性）猎塞，是早已存在的不需要外界賦予的特質试读。
44. 自調用函數(shù)執(zhí)行之后，如果沒有return 返回值或者聲明變量接受返回值荠耽，都會立即消失钩骇，?
output為一個輸出文本的函數(shù)，執(zhí)行
output(typeof (function (){output('hello world')})());
執(zhí)行結果為? hello world? undefined
首先執(zhí)行 自執(zhí)行函數(shù)? 函數(shù)打印? hello world?
然后執(zhí)行 typeof 空? 輸出 undefined
45. noscript? 標簽用來定義在腳本未被執(zhí)行時的替代內容
此標簽可被用于可識別 script標簽但無法支持其中的腳本的瀏覽器铝量。
46 .js引擎
1. 創(chuàng)建一個全局對象(Global Object) 倘屹， 這個對象全局只存在一份，它的屬性在任何地方都可以訪問慢叨，它的存在伴隨著應用程序的整個生命周期? 將 window? math date string等? 取得時候直接用即可放在全局對象上
2. JS引擎需要構建一個執(zhí)行環(huán)境棧 也要創(chuàng)建一個全局執(zhí)行環(huán)境EC 纽匙，并將這個全局執(zhí)行環(huán)境EC壓入執(zhí)行環(huán)境棧中。執(zhí)行環(huán)境棧的作用是為了保證程序能夠按照正確的順序被執(zhí)行拍谐。
3. JS引擎還要創(chuàng)建一個與EC關聯(lián)的全局變量對象vo? 并把VO指向全局對象烛缔，VO中不僅包含了全局對象的原有屬性，還包括在全局定義的變量x 和函數(shù) A赠尾，與此同時力穗，在定義函數(shù)A的時候，
還為 A 添加了一個內部屬性scope气嫁，并將scope指向了VO当窗。每個函數(shù)在定義的時候，都會創(chuàng)建一個與之關聯(lián)的scope屬性寸宵，scope總是指向定義函數(shù)時所在的環(huán)境崖面。此時的ECStack結構如下：
4. S引擎會創(chuàng)建函數(shù)A的執(zhí)行環(huán)境EC，然后EC推入執(zhí)行環(huán)境棧的頂部并獲取執(zhí)行權梯影。此時執(zhí)行環(huán)境棧中有兩個執(zhí)行環(huán)境巫员，分別是全局執(zhí)行環(huán)境和函數(shù)A執(zhí)行環(huán)境，A的執(zhí)行環(huán)境在棧頂甲棍，全局執(zhí)行環(huán)境在棧的底部简识。然后，創(chuàng)建函數(shù)A的作用域鏈(Scope Chain) 感猛，在javascript中七扰，每個執(zhí)行環(huán)境都有自己的作用域鏈，用于標識符解析陪白，當執(zhí)行環(huán)境被創(chuàng)建時颈走，它的作用域鏈就初始化為當前運行函數(shù)的scope所包含的對象。
47.JS的執(zhí)行機制是：
js解析過程分為兩個階段：預編譯期（預處理）與執(zhí)行期咱士。
首先判斷JS是同步還是異步立由，同步就進入主進程轧钓，異步就進入event table
異步任務在event table中注冊函數(shù)，當滿足觸發(fā)條件后锐膜，被推入event queue?
同步任務進入主線程后一直執(zhí)行毕箍，直到主線程空閑時，才會去event queue中查看是否有可執(zhí)行的異步任務枣耀，如果有就推入主進程中
執(zhí)行一個宏任務霉晕，過程中如果遇到微任務，就將其放到微任務的“事件隊列”里
當前宏任務執(zhí)行完成后捞奕，會查看微任務的“事件隊列”牺堰，并將里面全部的微任務依次執(zhí)行完
重復以上2步驟，結合event loop(1) event loop(2)颅围，就是更為準確的JS執(zhí)行機制
48 . match是string的方法
regex中方法
1. test(); 是否匹配?
2. exec(); 匹配的結果
3. complie(); 在執(zhí)行腳本中編譯整則表達式
49. 異步async
1. async 函數(shù)中可能會有 await 表達式伟葫，這會使 async 函數(shù)暫停執(zhí)行，等待表達式中的 Promise 解析完成后繼續(xù)執(zhí)行 async 函數(shù)并返回解決結果院促。
2. async 函數(shù)返回一個 Promise 對象筏养，當函數(shù)執(zhí)行的時候，一旦遇到 await 就會先返回常拓，等到觸發(fā)的異步操作完成渐溶，再接著執(zhí)行函數(shù)體內后面的語句。
51.? boolean 轉為false的6個值? ? undefined 弄抬、null 茎辐、 '' 、NaN 掂恕、 0 拖陆、 false 。
false == '0'? true
false === '0' false
52. 預編譯(函數(shù)執(zhí)行前)※
1. 創(chuàng)建AO對象（Active Object）
2. 查找函數(shù)形參及函數(shù)內變量聲明懊亡，形參名及變量名作為AO對象的屬性依啰，值為undefined
3. 實參形參相統(tǒng)一，實參值賦給形參
4. 查找函數(shù)聲明店枣，函數(shù)名作為AO對象的屬性速警，值為函數(shù)引用
預編譯(腳本代碼塊script執(zhí)行前)
1. 查找全局變量聲明（包括隱式全局變量聲明，省略var聲明）鸯两，變量名作全局對象的屬性坏瞄，值為undefined
3. 查找函數(shù)聲明，函數(shù)名作為全局對象的屬性甩卓，值為函數(shù)引用】
注意： 預編譯階段發(fā)生變量聲明和函數(shù)聲明，沒有初始化行為（賦值）蕉斜，匿名函數(shù)不參與預編譯只有在解釋執(zhí)行階段才會進行變量初始化
53. 閉包? ：函數(shù)執(zhí)行返回值為次函數(shù)聲明的內部函數(shù)? 會產(chǎn)生閉包? 閉包會產(chǎn)生內存泄漏逾柿，settimeout的第一個參數(shù)不是函數(shù)的時候缀棍，也容易產(chǎn)生內存泄漏。
54. cookie怎么存儲 存儲在哪里
cookie使用 set存儲? get獲取? ?
cookie存儲在瀏覽器端机错，每次請求會攜帶cookie
是客戶端用來存儲數(shù)據(jù)的一種選項爬范，它既可以在客戶端設置也可以在服務器端設置。cookie會跟隨任意HTTP請求一起發(fā)送弱匪。
缺點：一是增加了網(wǎng)絡流量青瀑，二是數(shù)據(jù)容量有限，最多只能存儲4kb的數(shù)據(jù)萧诫，瀏覽器之間各有不同斥难，三是不安全。
55. promise.all().then()? race()?
.then 執(zhí)行回調函數(shù)
Promise.all() // 所有的都有完成帘饶，相當于 且
?Promise.race() // 完成一個即可哑诊，相當于 或 不管成功與否，也可以返回失敗
**就先發(fā)這么多吧及刻，后邊的一百多道我再總結總結**
