6.17面试笔记

面试时间：30分钟

1. css盒子模型

• 从最外层依次往内：
  • margin：外边距
  • border：边框
  • padding：内边距
  • 显示内容

2. css选择器优先级以及你常用哪个方式增大优先级
   • 内联样式（权值：1000）
   • id选择器（权值：100）
   • 类选择器（权值：10）
   • 元素选择器（权值：1）
3. 水平居中的多种方式和你推荐哪种
   • 设置宽度 + margin:0 auto
   • display: inline-block + text-align: center

• {txt:display属性常见值：[block:块级元素，可设置边距][inline:行级元素，一行可有多个元素且高度不可变][inline-box:行内块级元素，一行可多个元素且可设置边距]}

  • 设置宽度+position: absolute+left: 50%+margin-left: -(宽度值/2)

• {txt:left：50%:[距浏览器左偏50%]}

  • < center>< /center>
  • display: flex+justify-content: center

• {txt:justify-content:[用于flex的盒子元素在主轴方向的对齐方式]}

4. 左右两栏宽度固定中间自适应的三栏布局
   • < div id = “left” >< /div>
     < div id = “right” >< /div>
     < div id = “center” >< /div>
     #left,#right{ width: 200px} #center{width：100%}
5. typeof和instanceof的区别
   • typeof 是判断参数是什么类型，返回值为说明类型的字符串
   • instanceof是用来判断一个对象在其原型链中是否存在一个构造函数的prototype属性
6. 多种方式获取对象的key值
   • for(var key in obj){ console.log(key,obj[key]) }
   • console.log(Object.keys(obj))
7. 数组去重
   • Array.from(new Set(arr))
   • for(var i=0; i<arr.length; i++){ for(var j=i+1; j<arr.length; j++){ if(arr[i]==arr[j]){ arr.splice(j,1); j--; } } }