1乓序、如何理解CSS的盒子模型披坏？
標(biāo)準(zhǔn)盒子模型：寬度=內(nèi)容的寬度（content）+ border + padding
低版本IE盒子模型：寬度=內(nèi)容寬度（content+border+padding）
2输涕、 BFC？
-
什么是 BFC
BFC（Block Formatting Context）格式化上下文哥蔚，是 Web 頁面中盒模型布局的 CSS 渲染模式倒谷，指一個(gè)獨(dú)立的渲染區(qū)域或者說是一個(gè)隔離的獨(dú)立容器。
-
形成 BFC 的條件
- 浮動(dòng)元素肺素，float 除 none 以外的值
- 定位元素恨锚，position（absolute，fixed）
- display 為以下其中之一的值 inline-block倍靡，table-cell猴伶，table-caption
- overflow 除了 visible 以外的值（hidden，auto塌西，scroll）
-
BFC 的特性
- 內(nèi)部的 Box 會(huì)在垂直方向上一個(gè)接一個(gè)的放置他挎。
- 垂直方向上的距離由 margin 決定
- bfc 的區(qū)域不會(huì)與 float 的元素區(qū)域重疊。
- 計(jì)算 bfc 的高度時(shí)捡需，浮動(dòng)元素也參與計(jì)算
- bfc 就是頁面上的一個(gè)獨(dú)立容器办桨，容器里面的子元素不會(huì)影響外面元素。
3站辉、如何清除浮動(dòng)
不清楚浮動(dòng)會(huì)發(fā)生高度塌陷：浮動(dòng)元素父元素高度自適應(yīng)（父元素不寫高度時(shí)呢撞，子元素寫了浮動(dòng)后损姜，父元素會(huì)發(fā)生高度塌陷）
- clear清除浮動(dòng)（添加空div法）在浮動(dòng)元素下方添加空div,并給該元素寫css樣式： {clear:both;height:0;overflow:hidden;}
- 給浮動(dòng)元素父級設(shè)置高度
- 父級同時(shí)浮動(dòng)（需要給父級同級元素添加浮動(dòng)）
- 父級設(shè)置成inline-block，其margin: 0 auto居中方式失效
- 給父級添加overflow:hidden 清除浮動(dòng)方法
- 萬能清除法 after偽類 清浮動(dòng)（現(xiàn)在主流方法殊霞，推薦使用）
.float_div:after{
content:".";
clear:both;
display:block;
height:0;
overflow:hidden;
visibility:hidden;
}
.float_div{
zoom:1
}
4摧阅、 用純CSS創(chuàng)建一個(gè)三角形的原理是什么？
5绷蹲、 css3實(shí)現(xiàn)0.5px的細(xì)線
6棒卷、css實(shí)現(xiàn)三欄布局 （左右固定，中間自適應(yīng)）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
.box {
display: flex;
justify-content: center;
height: 200px;
}
.left {
width: 200px;
background-color: red;
height: 100%;
}
.content {
background-color: yellow;
flex: 1;
}
.right {
width: 200px;
background-color: green;
}
</style>
</head>
<body>
<div class="box">
<div class="left"></div>
<div class="content"></div>
<div class="right"></div>
</div>
</body>
</html>
6祝钢、讓一個(gè)div垂直居中
寬度高度已知的 ??? 寬度和高度未知 ? ??flex布局
7比规、談一談css的偽類和偽元素
1、閉包
2拦英、js中函數(shù)執(zhí)行
3蜒什、new一個(gè)對象的過程中發(fā)生了什么嘛
4、宏任務(wù)跟微任務(wù)
5龄章、防抖和節(jié)流
6吃谣、數(shù)組的常用方法
7、立即執(zhí)行函數(shù)
8做裙、js原型和原型鏈
9岗憋、js中call,apply,bind方法
10、Promise
11锚贱、async/await
12仔戈、深拷貝、淺拷貝
13拧廊、跨域
14监徘、for in 和 for of
15、如何阻止冒泡吧碾？
16凰盔、如何阻止默認(rèn)事件？
17倦春、var,let,const
18户敬、Class
19、Set
20睁本、Map
1尿庐、實(shí)現(xiàn)一個(gè)new操作符
2、實(shí)現(xiàn)一個(gè)call或 apply
3呢堰、實(shí)現(xiàn)一個(gè)Function.bind
4抄瑟、實(shí)現(xiàn)一個(gè)繼承
5、手寫一個(gè)Promise(中高級必考)
6枉疼、手寫防抖(Debouncing)和節(jié)流(Throttling)
7皮假、手寫一個(gè)JS深拷貝
function deepCopy(obj) {
//判斷是否是簡單數(shù)據(jù)類型鞋拟，
if (typeof obj == "object") {
//復(fù)雜數(shù)據(jù)類型
var result = obj.constructor == Array ? [] : {};
for (let i in obj) {
result[i] = typeof obj[i] == "object" ? deepCopy(obj[i]) : obj[i];
}
} else {
//簡單數(shù)據(jù)類型 直接 == 賦值
var result = obj;
}
return result;
}
1、Vue的雙向數(shù)據(jù)綁定原理是什么惹资？
2严卖、請?jiān)敿?xì)說下你對vue生命周期的理解？
beforeCreate 創(chuàng)建前執(zhí)行（vue實(shí)例的掛載元素$el和數(shù)據(jù)對象data都為undefined布轿，還未初始化）
created 完成創(chuàng)建 （完成了data數(shù)據(jù)初始化，el還未初始化）
beforeMount 載入前（vue實(shí)例的$el和data都初始化了来颤，但還是掛載之前為虛擬的dom節(jié)點(diǎn)汰扭，data.message還未替換。）
mounted 載入后html已經(jīng)渲染(vue實(shí)例掛載完成福铅，data.message成功渲染萝毛。)
beforeUpdate 更新前狀態(tài)（view層的數(shù)據(jù)變化前，不是data中的數(shù)據(jù)改變前）
updated 更新狀態(tài)后
beforeDestroy 銷毀前
destroyed 銷毀后 （在執(zhí)行destroy方法后滑黔，對data的改變不會(huì)再觸發(fā)周期函數(shù)笆包，說明此時(shí)vue實(shí)例已經(jīng)解除了事件監(jiān)聽以及和dom的綁定，但是dom結(jié)構(gòu)依然存在）
說一下每一個(gè)階段可以做的事情
beforeCreate:可以在這里加一個(gè)loading事件略荡，在加載實(shí)例時(shí)觸發(fā)庵佣。
created:初始化完成時(shí)的事件寫這里，如果這里結(jié)束了loading事件汛兜，異步請求也在這里調(diào)用巴粪。
mounted:掛在元素，獲取到DOM節(jié)點(diǎn)
updated:對數(shù)據(jù)進(jìn)行處理的函數(shù)寫這里粥谬。
beforeDestroy:可以寫一個(gè)確認(rèn)停止事件的確認(rèn)框肛根。
3、動(dòng)態(tài)路由定義和獲取
在 router 目錄下的 index.js 文件中漏策，對 path 屬性加上 /:id派哲。
使用 router 對象的 params.id 獲取
4、vue-router 有哪幾種導(dǎo)航鉤子?
三種
- 全局導(dǎo)航鉤子（跳轉(zhuǎn)前進(jìn)行判斷攔截）
- router.beforeEach(to, from, next),
- router.beforeResolve(to, from, next),
- router.afterEach(to, from ,next)
2.組件內(nèi)鉤子
- beforeRouteEnter
- beforeRouteUpdate
- beforeRouteLeave
3.單獨(dú)路由獨(dú)享組件
- beforeEnter
5掺喻、組件之間的傳值通信芭届？
父組件向子組件傳值：
子組件在props中創(chuàng)建一個(gè)屬性，用來接收父組件傳過來的值巢寡；
在父組件中注冊子組件喉脖；
在子組件標(biāo)簽中添加子組件props中創(chuàng)建的屬性；
把需要傳給子組件的值賦給該屬性
子組件向父組件傳值：
子組件中需要以某種方式（如點(diǎn)擊事件）的方法來觸發(fā)一個(gè)自定義的事件抑月；
將需要傳的值作為$emit的第二個(gè)參數(shù)树叽，該值將作為實(shí)參傳給響應(yīng)事件的方法；
在父組件中注冊子組件并在子組件標(biāo)簽上綁定自定義事件的監(jiān)聽谦絮。
