面试总结1

最新推荐文章于 2025-12-12 18:00:26 发布

转载最新推荐文章于 2025-12-12 18:00:26 发布 · 73 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://juejin.im/post/5c95e1a15188252d812c551c

文章标签：

#面试 #javascript #ViewUI

总结

1.return，break，continue的区别

1.return

return是结束这个方法，不论在return之外嵌套了多少层循环

2.break

break是跳出整个循环

3.continue

continue是中止本次循环，继续下一次循环

2.vue是如何渲染的

vue是首先通过正则进行匹配，生成一个AST文件，然后进行优化AST文件，最后通过render函数渲染为一个vDOM，在隐射为真实的DOM;

3.执行栈与任务队列

js主线程上有任务队列和执行栈，执行代码时，遇到函数时，将函数放置在执行栈上，执行结束后出栈，执行栈上的顺序是先同步后异步，任务队列上按照优先级进行排列，例如：promise>settimeout

4.盒子居中

4.1水平居中

<style>
.son1{
        /* 水平居中 */
        /* margin:0 auto; */
width: 100px;
        height: 100px;
        background-color: red;
}
</style>

复制代码

4.2水平垂直居中

1.<style> 
    .son1{
        /* 水平垂直居中 :绝对定位与transform结合使用*/
        position: absolute;
        top:50%;
        left:50%;
        transform: translate(-50%,-50%);
        width: 100px;
        height: 100px;
        background-color: red;
    }
 </style>

2.<style>
	.son{
            width: 100px;
            height: 100px;
            background-color: red;
            position: absolute;
            left:50%;
            top:50%;
            margin:-50px -50px;
        }
    </style>
复制代码

5.工程化的理解

1.代码规范；

2.分支管理；

3.模块管理；

4.自动化测试；

6.登录拦截

6.1路由守卫

分为全局路由守卫和路由独享守卫

路由独享守卫是在router.js的路由路径配置中，使用beforeEnter(to,from,next){}方法，

首先进行token判断，有则next()让页面正常跳转，没有就让跳转到login的页面；

全局路由守卫是调用router.beforeEnter(to,from,next){

首先判断是否要登录拦截（在路由配置中，配置一个字节，表明他是需要登录拦截的），如果需要则判断token,有则跳转，没有则进入login,

}

6.2http拦截

http拦截：axios.interceptors.response.use(config,err)

axios.interceptors.request.use(res,err) res请求成功的数据

通过axios.create()方法克隆一个axios,为了防止全局污染axios

首先判断是否有token，没有则跳转到login页面，有token就将token放到config（请求头的信息）中去并且将他return出去，请求失败，else{ return Promise.reject(err)},this.$axios.get('***').then(res成功的回调函数).catch(err失败的回调)，catch会捕获到err这个错误，

7.JSONP的原理

通过script的src跨域原理

//js部分

var script = document.creatElement('script');//创建script标签
var url = 'https://www.zjj.com?age=18&callback=fight';//拼接字符串（网址？参数&回调函数）
script.setAttribute('src',url);//给script设置src属性，src=url
document.getElementById('#header').appendChild(script);//将script方法加到header中
//后台会返回一个fight（response），随后客户端会调用我们自己定义的fight的方法

复制代码

<script>
    function fight(){
        <ul>
            for (i=0;i<res.length;i++){
                <li>res.hobby</li>
            }
		</ul>
    }
</script>
复制代码

jquery调用jsonp

<script>
    function getdata(){
    //发送Ajax请求
    $.ajax({
        url:'https://www.zjj.com?age=18&callback=fight',//url地址
        datatype:'jsonp',//请求data的方式
        jconp:'callback'//回调函数
        success:function (){
    }
    })
}
</script>
    
复制代码

转载于:https://juejin.im/post/5c95e1a15188252d812c551c