瓜子前端一面面经
CSS
块元素与行内元素区别,分别是那些标签
块级元素:独占一行(宽度默认容器的100%),可以容纳其他元素,宽高内外边距可控;div、p、h123456、hr、table、li、ul、ol
行内元素: 可以多个元素在同一行,不能设置宽高,只可以容纳文字与其他行内元素,只可以设置水平内外边距;a、img、span、label、b、br
行内块元素:与同级元素在一行但有空白间隙,默认宽度是内容宽度,宽高及内外边距可以设置;input、button、iframe
position
absolute: 生成绝对定位的元素,相对于 static 定位以外的第一个父元素(设置relative)进行定位。脱离普通文档流,所以其中的操作不会对普通文档render产生影响,但因为没有脱离默认复合层还是会进行重绘的
fixed: 生成绝对定位的元素,相对于浏览器窗口进行定位。
relative 生成相对定位的元素,相对于其正常位置进行定位
static 默认值。没有定位,元素出现在正常的流中
inherit 继承父级position属性值
JS
讲一下继承
函数一般来讲有两种方式出现 一种是函数表达式,一种是声明式函数
前者的构造函数是匿名的后者的则是同名,这不影响接下来阐述的内容
讲继承必然离不开原型链
需要知道每个函数都要一个指向原型对象的prototype指针,而对应的原型对象又有指向其构造函数的constructor指针
而每当我们new一个实例(使用构造函数,当使用new操作符时函数就被称为构造函数)后,这个实例有内部属性(某些浏览器可访问属性__proto__),这个属性则指向原型对象,通过这个属性逐层查找就会找到Object->null为止 整个串起来就是原型链
所以说继承就是通过一些方式获取原型对象的属性与方法
原型链继承
通过更改原型对象指针也就是prototype属性获取指定原型对象属性与方法隐式继承不稳定(基础类型修改无影响,引用类型修改会影响整个链,当然前提是修改原型对象属性)
借用构造函数/经典继承,上个方法我们发现基于同一个原型对象的话,无法进行有效的隔离,则我们可以借助构造函数来实现每个实例拥有自己的属性与方法
具体就是通过在一个中间函数使用sourceFunction.call(this,param1,param2)或者sourceFunction.apply(this,paramArray)与sourceFunction.bind(this,param1,param2)(),这样我们通过中间函数构造的实例就能拥有自己单独的属性与方法,弊端也就是仅限于构造函数实现的属性与方法
组合继承
将上面两种方式组合起来,原理大概我们通过原型继承后去使用属性时因为当前实例没有要找的属性所以回去原型对象上找,而我们再改变原型对象的基础上曾加对原型对象构造函数的借用,这样实现的实例就有了我们要找的属性从而不会去上层查找,也能够使用构造函数没有实现的原型对象的属性与方法了
原型式继承
简单来讲就是将源对象中属性浅拷贝到目标对象中,实现方式多种比如let traget = Object.create(source,extra);Object.assign(target,source)
寄生式继承
我理解为原型是继承增强版,原滋原味加点作料,共用引用类型属性的同时,增加点自己的东西
寄生组合式继承
这是被认为理想的继承方式,使用寄生式继承替换原型链继承避免了组合式继承时多一次对构造函数的实现
说一下ES6
分别说了下
let,const,块级作用域
...
解构
symbol、set、map
promise
讲完promise后面试官说写一个数组扁平化
最后照例反问
评价如何
面试官:不算优秀也不算差(就是一般的意思呗)