面试题记录

上官透透
127 阅读2分钟

1.css,div垂直居中(子元素宽高不固定)

<div class="wrapper">
    <div class="content"></div>
</div>

(1) position,tranform

.wrapper{
    width: 100%;
    height: 100%;
    position: relative;
}
.content{
    position: absolute;
    left: 50%;
    top: 50%;
    tranform: translateX(-50%) translateY(-50%);
}

(2) flex

.wrapper{
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

2.js基本数据类型和引用数据类型

（1）基本数据类型： String,Number,Boolean,Null,Undefined,Symbol

（2）引用数据类型：Object,Function,Array


3.css优先级

!important > id选择器 > class选择器 > tag选择器


4.css选择器有哪些

（1）通配符*

（2）id

（3） class

（4）群组： div,p,ul{}

（5）后代： div p{}


5.css中的BFC

BFC其实就是，对css多种定位方案在使用过程中相互影响的解决方案

（1）解决margin叠加问题

（2）用于布局

（3）清除浮动，计算BFC的高度 css中的BFC(www.html-js.com/article/186…)


6.vue数据双向绑定的原理 
Object.defineProperty()

(www.cnblogs.com/canfoo/p/68…)


7.vue中的watch和computed

watch支持异步，computed不支持，同时watch里面的函数接收两个值。分别为变化前和变化后的值，computed中只要依赖的值发生变化，便会重更新计算。


8.vue的生命周期

(juejin.cn/post/684490…)

Vue生命周期


9.跨域原因，如何跨域(juejin.cn/post/684490…)

原因：浏览器的同源策略（同协议，同域名，同端口）

工程服务化后，不同职责的服务分散在不同的工程中，往往这些工程的域名是不同的，但一个需求可能需要对应到多个服务，这时便需要调用不同服务的接口，因此会出现跨域。

解决方法：

（1）jsonp

<script type="text/javascript">
    function dosomething(data){
        //处理获得的数据
    }
</script>
<script src="http://example.com/data.php?callback=dosomething"></script>

<?php
$callback = $_GET['callback'];//得到回调函数名
$data = array('a','b','c');//要返回的数据
echo $callback.'('.json_encode($data).')';//输出
?>

【JSONP的优缺点】 优点：兼容性好（兼容低版本IE） 缺点：1.JSONP只支持GET请求； 2.XMLHttpRequest相对于JSONP有着更好的错误处理机制

(2) CORS

(3) postMessage

window.postMessage(message,targetOrigin) 方法是html5新引进的特性，可以使用它来向其它的window对象发送消息，无论这个window对象是属于同源或不同源，目前IE8+、FireFox、Chrome、Opera等浏览器都已经支持window.postMessage方法。

otherWindow.postMessage(message, targetOrigin, [transfer]);
  1. Vue中nextTick方法

Vue.nextTick(callback)，当数据发生变化，更新后执行回调。 Vue.$nextTick(callback)，当dom发生变化，更新后执行的回调。

11.js原型链(segmentfault.com/a/119000001…)

构造函数,原型和实例的关系 每个构造函数(constructor)都有一个原型对象(prototype),原型对象都包含一个指向构造函数的指针,而实例(instance)都包含一个指向原型对象的内部指针. 原型链和继承好好研究下单独写一篇吧～

avatar
文章
阅读
粉丝