小白前端面试(2)--校内选拔

    技术2025-10-03  10

    此次面试进行的也是一次前端方向的,整体上因为自己基础知识掌握的还不是特别好,所以问的问题也没有很深入,所以时间也比较短,接下来应该把基础知识研究得透一点。

    1.自我介绍

    简单介绍了一下学历,和前端的学习情况。自己在这里应该回答的不好,本科不是学这个的,措辞不是很好,应该尽量避免。其次是为什么选择前端的岗位这里,也是回答的不够完美,只是说为了找实习而学习前端。下去应该完善一下这个问题的回答。

    2.垂直水平居中

        固定宽高元素水平垂直居中: 通过margin平移元素整体宽度(包括padding等)的一半,使元素水平垂直居中。

        未知宽高元素水平垂直居中:利用2D变换,在水平和垂直两个方向都向反向平移宽高的一半,从而使元素水平垂直居中。transform: translate(-50%, -50%);

        利用flex布局(display:flex):其中justify-content 用于设置或检索弹性盒子元素在主轴(横轴)方向上的对齐方式(center);而align-items属性定义flex子项在flex容器的当前行的侧轴(纵轴)方向上的对齐方式(center)。

        利用grid布局(display:grid):兼容性较差,不推荐

        在屏幕上水平垂直居中:常规的登录及注册页面都需要用到。要保证较好的兼容性,还需要用到表布局。

    3.清除浮动

    这个是前端面试的必考题,回答的不是很好。

           方法一:在最后一个子元素新添加最后一个冗余元素,然后将其设置clear:both,这样就可以清除浮动。        方法二:父级div定义 overflow: hidden;这种方案让父容器形成了BFC(块级格式上下文),而BFC可以包含浮动,通常用来           解决浮动父元素高度坍塌的问题。        方法三:利用:after和:before来在元素内部插入两个元素块,从而达到清除浮动的效果。        .clear{zoom:1;}

           .clear:after{content:””;clear:both;display:block;height:0;overflow:hidden;visibility:hidden;}

    4.闭包

    这个之前面试也是考过一次,这次还是回答的比较模糊。

         (1)定义:函数 A 内部有一个函数 B,函数 B 可以访问到函数 A 中的变量,那么函数 B 就是闭包。即有权访问另一个函数作用域变量的函数都是闭包。  

    (2)意义就是让我们可以间接访问函数内部的变量。闭包是块作用域(解决异步循环输出相同问题)

    一个变量在当前作用域没有定义,但是被使用了,会向上级作用域,一层一层依次寻找,直到找到为止,如果到全局作用域都没有找到,则报错xx is not defined

    三级作用域:全局作用域(全局都可以使用,如document对象)函数作用域(一个函数中定义的只能在当前函数使用)块级作用域(ES新增)(块:包含if while等包含大括号,在大括号外使用会报错)

    (3)应用场景:函数作为参数被传递(函数在一个地方定义好之后,到另一个地方去执行)

    函数作为返回值被返回(函数定义好之后会被返回到另一个地方执行)

    (4)机制:当我们调用一个闭包函数,在函数执行时,其上下文有个Scope属性,该属性作为一个作用域链包含有该函数被定义时所有外层的变量对象的引用,所以定义了闭包的函数虽然销毁了,但是其变量对象依然被绑定在函数inner上,保留在内存中。

    影响:变量会常驻内存,得不到释放。因此闭包不要乱用,可能会影响性能

    (5)注意:所有的自由变量的查找,是在函数定义的地方,向上级作用域查找,不是在执行的地方

    5.js继承

    原型链继承;构造函数继承;实例继承;组合继承;拷贝继承;寄生组合继承

    6.vue组件间的通信

    (1)父组件向子组件传值

    在组件的vue实例中,设置props对象,对象中的每个成员,都是父组件要传递的数据

    在父组件中,把data使用v-bind绑定给子组件需要的数据(父组件访问子组件:给子组件添加ref属性;通过this.$refs.ref属性值来访问子组件,可以直接调用子组件的data和methods)

    (2)子组件向父组件传值

    在子组件中绑定一个事件

    在事件对应的方法中,使用this.$emit()向父组件发出事件,参数为事件名

    父组件使用v-on来监听子组件传递的事件,将该事件绑定给某个方法

    (子组件访问父组件:通过this.$parent来访问父组件;通过this.$root来访问子组件)

      (3)兄弟组件

    A. 兄弟之间传递数据需要借助于事件中心,通过事件中心传递数据; 提供事件中心 var hub = new Vue()

    传递数据方,通过一个事件触发hub.$emit(方法名,传递的数据)

    接收数据方,通过mounted(){} 钩子中 触发hub.$on()方法名

    销毁事件 通过hub.$off()方法名销毁之后无法进行传递数据

    B. 多级组件嵌套需要传递数据时,通常使用的方法是通过vuex。

    C. 但如果仅仅是传递数据,而不做中间处理,使用 vuex 处理,未免有点大材小用。为此Vue2.4 版本提供了另一种方法---               -$attrs/$listeners

    D.方法六、$parent / $children与 ref

           ref:如果在普通的 DOM 元素上使用,引用指向的就是 DOM 元素;如果用在子组件上,引用就指向组件实例        $parent / $children:访问父 / 子实例

    之后为什么选择前端的这个问题还是要再多思考思考措辞,要怎么进行回答,回答的不是很好。干巴爹,继续怀挺吧!  

    Processed: 0.019, SQL: 9