表达面试题
1成都道引科技有限公司==》
1.画图描诉盒子模型
2.js原型链与闭包
3.用flex实现九宫格布局
4.在使用vue全家桶时,简述,登录和注册的操作,
5.购物车的数据结构
2成都超网有限公司
技术问题:
1vue生命周期
2==》闭包的作用
3==》如何实现一个盒子水平垂直居中
4vue双向绑定原理
5常用的vue指令
6==》vue和react的区别
他们的区别并不是特别的大
1==》(vue)是一个轻量级的框架 react是以及重量级的框架
2==》react是类式的写法,api很少, 而vue是声明式的写法,api多
3==》模板渲染方式的不同
React 是通过JSX渲染模板 而Vue是通过一种拓展的HTML语法进行渲染
10==》v-if和v-show的区别,以及应用场景
应用的场景==》如果某个元素经常的显示或者吟唱起来,建议使用v-show;
如果某个元素创建出来之后,以后可能在也会在使用了,使用v-if
11==》箭头函数和普通function函数的区别)
1==》箭头函数是匿名函数,不能作为构造函数,因此不能够使用new
2==》箭头函数不能绑定arguments
3==》箭头函数没有原型属性
4==》箭头函数的 this 永远指向其上下文的 this ,任何方法都改变不了其指向,如 call() , bind() , apply()
普通函数的this指向调用它的那个对象
12==》vue嵌套路由
嵌套路由就是路由里面嵌套他的子路由 子路由关键属性children
<router-link to="/父路由的地址名字/要去的子路由的名字"></router-link>
13==》vue路由的原理
1.一种是# hash , 在地址中加入#以欺骗浏览器,地址的改变是由于正在进行页内导航
通过改变浏览器地址URL,在不重新请求页面的情况下,更新页面视图
有两种方式:(了解)
2.一种是h5的history , 使用URL的Hash来模拟一个完整的URL
14==》怎么处理兼容问题
(1)通过hask的方式
Normalize.css 只是一个很小的CSS文件,但它在默认的HTML元素样式,让不同的浏览器的也可以表现为一致性。
15==》浅谈前端安全以及如何防范?
XSS是一种web应用中的计算机安全漏洞,它允许恶意web用户将代码植 入,XSS攻击的危害有:主要是盗取用户的信息,先网站发起攻击。如何解决:
XSS攻击的具体表现:1、JavaScript代码注入
1==》采用的模式匹配,“javascript”这个关键字进行检索,一旦发现提交信息中包含“javascript”,就认定为XSS攻击。
2==》对所有用户提交内容进行可靠的输入验证,
16==》$route和$router的区别
$route对表示当前的路由信息,包含了当前 URL
$router为VueRouter实例,主要是使用路由的跳转使用。
<script> for(var i=0;i<3;i++){ setTimeout(function(){ console.log(i); },0); console.log(i); } </script>
0 1 2 然后是3个3
17==》Px和rem和em的区别
1=》px像素(Pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的
2=》em是相对长度单位。相对于当前对象内文本的字体尺寸
1. em的值并不是固定的; 2. em会继承父级元素的字体大小。
默认它相对的是浏览器默认的字体尺寸(16px)。
3=》rem是CSS3新增的一个相对单位;仍然是相对大小,但相对的只是HTML根元素。
项目如何优化
(较少图片的体积) 图片较多的情况下使用懒加载 使用雪碧精灵图
18第五题: JS中检测变量为string类型的方法
var aa = "hello world"; function stringCheck (str) { if(typeof str =="string" || str.constructor == String) { return true; } else { return false; } } console.log(stringCheck(aa)) ;
18.第一次页面加载会触发哪几个钩子?
答:会触发 下面这几个beforeCreate, created, beforeMount, mounted 。
19vue实现数据双向绑定原理:
采用数据劫持 结合发布者-订阅者模式的方式,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应监听回调
它是一个导航钩子
20beforeEach主要有3个参数to,from,next:
to:route即将进入的目标路由对象, from:route当前导航正要离开的路由next:
function一定要调用该方法resolve这个钩子。执行效果依赖next方法的调用参数。可以控制网页的跳转。
4.vue.js的两个核心是什么?
答:数据驱动、组件系统
6.vue常用的修饰符?
答:.prevent: 提交事件不再重载页面;.stop: 阻止单击事件冒泡;.self: 当事件发生在该元素本身而不是子元素的时候会触发;
7.v-on 可以绑定多个方法吗?
答:可以
21什么是盒模型
把所有的网页元素都看成一个盒子,它具有:content,padding,border,margin四个属性,这就是盒子模型
盒子模型有两种形式:标准盒子模型,怪异盒子模型
22css有哪些定位
Relative
相对定位方式,相对于自己原来的位置进行移动。
Absolute
绝对定位方式,脱离文档流,不会占用页面空间。
以最近的非static定位的父级元素作为参考进行定位,
如果其所有的父级元素都是static定位,那么此元素最终则是以当前窗口作为参考进行定位
3.fixed
固定定位,固定盒子不随网页滑动而移动
固定定位盒子也脱标
23如何实现元素垂直水平居中
第13题==》让元素水平 垂直居中的三种方式
/* 第一种方式 绝对定位 距离石中玉为0 最后margin:auto 兼容性:,IE7及之前版本不支持 这种方式的兼容性是最好的了*/ div { width: 200px; height: 200px; background: green; position: absolute; left: 0; top: 0; bottom: 0; right: 0; margin: auto; } /* 第二种方式 div绝对定位 【margin 负间距】*/ /* div { width: 200px; height: 200px; background: green; position: absolute; left: 50%; top: 50%; margin-left: -100px; margin-top: -100px; } */ /* 第三种方式 用了css3的知识 div绝对定位水平垂直居中【Transforms 变形】 IE8不支持*/ div { width: 200px; height: 200px; background: green; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
Jq的选择器
一、基本选择器
二、层次选择器 ul li parent > child prev + next prev ~ siblings
三、属性选择器 [attribute] [attribute=value] [attribute!=value]
[attribute^=value]
四、 表单选器
在php中null “” ‘’ 0 都会转化为false
2.3s后进行渐变哦
div { width: 200px; height: 200px; background: #000; transition: all 2.3s; } div:hover { background: #fff; }