zoukankan      html  css  js  c++  java
  • WEB前端面试题基础

    「 CSS篇 」

    1. CSS 盒子模型,绝对定位和相对定位

    2. 清除浮动,什么时候需要清除浮动,清除浮动都有哪些方法

    3. 如何保持浮层水平垂直居中

        答:absolute + 负margin  

               absolute + transform

               flex

               grid

    4. position 和 display 的取值和各自的意思和用法

        答:position属性取值:static(默认)、relative、absolute、fixed、inherit

               display属性取值:none、inline、inline-block、block、flex、inherit

    5. 样式的层级关系,选择器优先级,样式冲突,以及抽离样式模块怎么写,说出思路,有无实践经验

    6. css3动画效果属性,canvas、svg的区别,CSS3中新增伪类举例

    7. px和em和rem的区别,CSS中link 和@import的区别是?

    5. 了解过flex吗?

        答:flex-direction

               flex-wrap

               justify-content

               align-items

               align-content

    「 JavaScript 篇 」

    JavaScript 基础

    1. JavaScript 里有哪些数据类型,解释清楚 null 和 undefined,解释清楚原始数据类型和引用数据类型。比如讲一下 1 和 Number(1)的区别

    2. 将一下 prototype 是什么东西,原型链的理解,什么时候用 prototype

        答:js中,prototype是函数的原型。每个函数都是一个对象,并且拥有一个属性prototype,该属性也是一个对象,是属性和方法的集合。

          原型链:实例对象的原型__proto__指向new出该实例对象的构造函数原型prototype,再指向原始的对象原型Object.prototype,再指向null,形成原型链。

          使用prototype的好处是不会产生额外的内存,所有实例化后的对象都会从原型上继承这个属性或方法。当一个子类需要拥有父类的某些属性或方法,

               该属性或方法可以覆 盖,又可以添加自己的属性和方法,这个操作不影响父类,这个时候使用prototype。

          fn.__proto__===Fn.prototype
          Fn.prototype.constructor===Fn

    3. 函数里的this什么含义,什么情况下,怎么用。

        答:通常在构造函数中使用,就是通过这个函数生成一个新对象(object)。这时,this就指这个新对象。

          function test(){
            this.x = 1;
          }
          var o = new test();
          alert(o.x); // 1
               运行结果为1。为了表明这时this不是全局对象,对代码做一些改变:
          var x = 2;
          function test(){
            this.x = 1;
          }
          var o = new test();
          alert(x); //2
               运行结果为2,表明全局变量x的值没变。

    4. apply和 call 什么含义,什么区别?什么时候用。

        答:function add(c,d){

                   console.log(this.a + this.b + c + d);
                }
                var o ={a:1,b:3};


                add.call(o,5,7);    //1+3+5+7=16
                //传参的时候是扁平的把每个参数传进去


                add.apply(o,[10,20]);   //1+3+10+20=34
                //传参的时候是把参数作为一个数组传进去


                //什么时候使用call或者apply
                function bar(){
                    console.log(Object.prototype.toString.call(this));
                    // 用来调用一些无法直接调用的方法
                }
                bar.call(7); //"[object Number]"

    5. 数组和对象有哪些原生方法,列举一下,分别是什么含义,比如连接两个数组用哪个方法,删除数组的指定项和重新组装数组(操作数据的重点)。

        答:数组:

                length设置或返回 数组中元素的数目。
                push() :向数组的末尾添加一个或多个元素,并返回新的长度,也就是添加元素后的数组长度。
                shift():用于把数组的第一个元素从其中删除,并返回第一个元素的值。
                unshift():向数组的开头添加一个或更多元素,并返回新的长度。
                pop():用于删除并返回数组的最后一个元素。
                splice():用于插入、删除或替换数组的元素。
                concat():方法用于连接两个或多个数组。
                join():用于把数组中的所有元素放入一个字符串。元素是通过指定的分隔符进行分隔的。
                toString():方法可把数组转换为字符串,并返回结果。
                reverse():方法用于颠倒数组中元素的顺序。
                slice():方法可从已有的数组中返回选定的元素。
                sort():方法用于对数组的元素进行排序(从小到大)。

                indexOf():返回获取项在数组中的索引
                lastIndexOf():返回获取项在数组中出现的最后一次索引
                forEach():循环遍历数组 参数是一个匿名函数 默认返回为undefined
                map():循环遍历数组 参数是一个匿名函数

                对象:

                charAt(): 返回在指定位置的字符。
                charCodeAt(): 返回在指定的位置的字符的 Unicode 编码。
                concat():连接字符串。
                indexOf():检索字符串。
                match(): 找到一个或多个正则表达式的匹配。
                replace():替换与正则表达式匹配的子串。
                search(): 检索与正则表达式相匹配的值。
                slice(): 提取字符串的片断,并在新的字符串中返回被提取的部分。
                split(): 把字符串分割为字符串数组。
                toLocaleLowerCase(): 把字符串转换为小写。
                toLocaleUpperCase(): 把字符串转换为大写。
                toLowerCase(): 把字符串转换为小写。
                toUpperCase(): 把字符串转换为大写。
                substr(): 从起始索引号提取字符串中指定数目的字符。
                substring(): 提取字符串中两个指定的索引号之间的字符。

    6. 怎样避免全局变量污染?ES5严格模式的作用,ES6箭头函数和ES5普通函数一样吗?

        答:避免污染个人常用模块化解决

               箭头函数和普通函数区别在于this的使用

               由于箭头函数使得this从“动态”变成“静态”,下面两个场合不应该使用箭头函数。

              第一个场合是定义函数的方法,且该方法内部包括this

              第二个场合是需要动态this的时候,也不应使用箭头函数。

    JavaScript 的面向对象

    1. JS 模块包装格式都用过哪些,CommonJS、AMD、CMD。定义一个JS 模块代码,最精简的格式是怎样。

    2. JS 怎么实现一个类。怎么实例化这个类。

    3. 理解闭包吗?请讲一讲闭包在实际开发中的作用;闭包建议频繁使用吗?

    4. 说一下了解的js 设计模式,解释一下单例、工厂、观察者。

    5. ajax 跨域有哪些方法,jsonp 的原理是什么,如果页面编码和被请求的资源编码不一致如何处理?



    作者:前端攻城小牛
    链接:https://www.jianshu.com/p/eb0f269098d5
    来源:简书
    著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
  • 相关阅读:
    使用树莓派3获取CPU温度
    使用树莓派控制继电器
    Darknet图像训练的步骤
    Faster-Rcnn图像识别训练的步骤
    Centos7中ELK集群安装流程
    近年来较流行的搜索引擎框架
    机器学习中,使用NMS对框取优
    当前Azure中国可使用的虚拟机的Size列表
    汉语词性对照表[北大标准/中科院标准]
    Linux中禁用THP(Transparent Huge Pages)
  • 原文地址:https://www.cnblogs.com/yangshuzhong/p/12371378.html
Copyright © 2011-2022 走看看