一些面试题

48 阅读7分钟
  1. 什么是重绘?什么是回流?

    回流就是页面中元素的大小被修改 页面结构变化了就会引发重绘
    重绘就是页面中的元素样式被修改 页面结构不会发生变化就会跳过重绘直接回流
    重绘一定会发生回流   回流不一定会发生重绘
    
  2. flex常见属性有哪些?

    flex-direction  设置主轴的方向
    justify-content  设置主轴上子元素的排序方式
    align-items 设置侧轴上子元素的排序方式  (单行)
    align-content 设置侧轴上子元素的排序方式 (多行)
    flex-wrap 设置子元素是否换行
    flex-flow 复合属性   相当于同时设置flex-directionflex-wrap
    
  3. 介绍一下标准的CSS的盒子模型?与低版本IE的盒子模型有什么不同的?

    标准盒子模型又叫做w3c盒子模型  设置元素的height和width属性指的是盒子的高和宽
    低版本的IE盒子模型又叫做怪异盒子模型  设置元素的height和width属性指的是盒子的外边框和外边距和盒子的高和宽
    
  4. CSS选择器有哪些?哪些属性可以继承?CSS优先级算法如何计算?

        1.id选择器 2.类选择器3.标签选择器4.后代选择器5.子选择器6.伪类选择器7.通配符
        字体样式属性 文本样式属性 列表布局属性 表格布局属性
        元素可见性 页面样式属性
        !mportant > 行内样式 > id选择器 > 类选择器 > 标签选择器
        
        
    
  5. CSS3有哪些新特性?

    圆角边框  border-radius
    边框阴影  box-shadow
    背景图大小 background-size
    过渡  transition
    转换  transform
    动画  animation
    线性渐变  linear-gradient
    盒子模型  box-sizing
    
  6. display:none 与 visibility:hidden 的区别是什么?

    display:none会让元素在渲染树中完全消失 渲染时不占用任何空间
    display是非继承属性 子孙节点会随着父元素一起消失 修改子孙元素的属性也无法显示
    修改常规文档中元素的display属性会引起文档的回流
    
    visibility:hidden不会让元素在渲染树中消失 渲染时占据相应的位置  只是内容不可见
    visibility是继承属性  子孙节点消失是因为继承了hidden属性  通过修改子孙visibility:visible 可以让子孙显示
    修改常规文档中的visibility属性只会引起文档的重绘
    
  7. 用过CSS 预处理器吗?谈谈用过哪种?有什么特点?

    用过
    Less
    可以互相嵌套
    可以使用变量和计算  
    变量名要以@开头
    
    
  8. 怎么让Chrome支持小于12px 的文字?

    设置-webkit-transform:scale(0.8)
    
  9. 所有两个盒子, 左右盒子高度自适应,左盒子宽度固定,右盒子宽度自适应,怎么做?

          给父元素添加displayflex 给右侧的盒子添加 flex1
    
  10. 精灵图有什么好处?

    减少服务器发送和接收请求的次数 提高页面刷新加载速度
    
  11. 谈谈你对rem的理解?

    rem是根据根元素HTMLfont-size的大小来布局的方式
    
  12. 什么是自适应页面?什么是响应式页面?怎么做?

    自适应页面是同一张页面自动适应不同屏幕大小 根据屏幕的宽度 自动调整页面内容的大小
    自适应是通过rem来做不同分辨率屏幕
    响应式页面是可以自动识别屏幕大小来对整个网页进行调整布局和展示的内容可能会有所变动
    响应式是通过媒体查询来检测不同设备屏幕尺寸做处理
    
  13. 如何判断js的数据类型?

    通过typeof()判断  基本数据类型
    通过instanceof  判断对象的类型
    通过Object.prototype.toString.call(  )  判断引用数据类型
    
  14. let 和const特点是什么?

    let 是变量 可以先申明后赋值
    const是常量 申明就必须赋值
    
  15. 数组有哪些方法?

    push () 尾部添加 返回数组长度 改变原数组
    pop( ) 尾部删除  返回删除的元素  改变原数组
    unshift ()	头部添加  返回数组长度    改变原数组
    shift () 头部删除  返回删除的元素
    concat () 数组合并	  返回新数组
    join () 数组转字符串
    indexof()  查找元素   有就返回下标  没有就返回-1
    includes () 判断是否有元素  有就返回true  没有就返回false
    splice ()  删除指定数组元素
    forEach () 循环遍历操作原数组  没有返回值
    filter ()过滤 返回满足条件的新数组   返回新数组
    some ()遍历数组有一个满足条件就返回true  返回布尔值
    every ()遍历数组全部满足才返回true 有一个不满足就返回false  返回布尔值
    map ()遍历数组可以对每一个元素进行操作 返回新数组  原数组不变
    reduce ()给数组每一个元素进行一次回调, 一般用来求数组累加和
    
  16. 如何阻止事件冒泡?

    用 e.stopPropagation ()来阻止事件冒泡 但不会阻止默认事件
    
  17. 如何阻止默认行为?页面中有哪些默认行为

    用e.preventDefault()来阻止默认行为 
     链接的跳转  表单域跳转
    
  18. 说说js的运行机制

    1.同步代码放在执行栈中
    2.异步任务放在异步任务管理中
    3.优先执行执行栈内的同步代码
    4.执行栈代码结束了,需要去异步管理器中查看有没有哪个异步任务准备好了 准备好了就拖进执行栈中执行
    5.执行完毕,需要继续去队列中查看有没有下一个任务准备好,循环往复
    6.不断去查找和执行的过程叫做事件循环
    
  19. 谈谈对闭包的理解

    一个能够访问另一个作用域变量的函数叫闭包
    
  20. 如何遍历对象?3种

    Object.keys 用于获取对象中的所有属性名	
    Object.values 用来获取对象中的所有属性名
    for in
    
  21. 深浅拷贝怎么做?

        浅拷贝 如果拷贝的是简单数据 拷贝到新数据 修改新旧数据时 另一个数据不会受到影响
               如果开拷贝的是复杂类型 修改新数据时 旧数据也会跟着被修改
    
        深拷贝 系统会创建一个空间 新对象完全拷贝旧对象内的值  不管就对象里是否存在复杂类型  拷贝的不是地址 而是值  
        修改任意一个对象里的数据 另一个都不会受到影响
    
  22. 函数的this指向?谈谈你对箭头函数的理解?

    普通函数如果没有人调用它指向的是window 严格模式下没有调用者this的指向值是undefined
    简单来说就是 谁调用就指向谁
    箭头函数中不存在this 箭头函数中的this被默认绑定在上一层作用域中的this
    
  23. 什么是防抖?什么是节流?

    防抖是在一定时间内无论操作多少次只执行最后一次操作
    节流是在一定时间内只会执行一次
    
  24. 什么是本地存储?特点是什么?

    数据存储在用户浏览器中
    设置、读取方便、刷新页面不丢失数据
    容量较大  sessionStorage和loclStorage约5M
    loclStorage 的特点是 存储的数据可以跨页面使用  以键值对的形式存储 关闭页面也不会被删除
    sessionStorage 的特点是 在同一页面下可以共享  不能跨页面使用   关闭页面就会被删除
    
  25. 什么是递归?

    函数本身在内部调用自己就是递归函数
    如果不添加终止事件 递归就会持续执行
    会导致内存溢出 报错