web前端开发笔试题
2024-05-11 17:13:10
1.src与href的区别
(1)请求资源类型不同 ①href是Hypertext Reference的缩写,表示超文本引用。用来建立当前元素和
文档之间的链接。常用的有:link、a标签 ②在请求 src 资源时会将其指向的资源下载并应用到文档中，常用的有:script，
img 、iframe；
(2)作用结果不同①href 用于在当前文档和引用资源之间确立联系 ②src 用于替换当前内容
(3) 浏览器解析方式不同①若在文档中添加href ，浏览器会识别该文档为 CSS 文件，就会并行下载资源
并且不会停止对当前文档的处理。这也是为什么建议使用 link 方式加载 CSS，而不
是使用 @import 方式。②当浏览器解析到src ，会暂停其他资源的下载和处理，直到将该资源加载、编
译、执行完毕，图片和框架等也如此，类似于将所指向资源应用到当前内容。这也是
为什么建议把 js 脚本放在底部而不是头部的原因
2.页面元素隐藏方式 和各自特点？
(1)设置css display属性为none,效果：元素不显示，不占位
(2)设置css visibility属性为hidden,效果：元素不显示，但占位
3.用过哪些盒模型，以及他们各自的区别？
(1)IE盒子模型box-sizing:border-box;（怪异模式）
(2)W3C标准盒子模型 box-sizing:content-box;（标准模式）默认模式
4.谈谈你的移动端适配方案有哪些？
布局视口：CSS布局，是以布局视口做为参照系来计算的。一般手机浏览器的默认布局视口宽度为980px(黑莓和IE的宽度为1024px)
视觉视口：视觉视口是页面当前显示在屏幕上的部分
理想视口：理想视口的大小取决于设备独立像素的大小
Rem理想(适配)视口 viewport视觉视口 百分比布局视口
5.js 数据类型有几种？它们之间的区别是什么？
(1)简单数据类型(也称基本数据类型):Undefined;Null;Boolean;Number和String。
(2)引用数据类型(也称复杂数据类型),其中包括Object；Array；Function等等。
区别:1)基本类型在栈内存,引用类型在堆内存分配地址.2)不同的内存分配机制也带来了不同的访问机制3)复制变量时的不同4)参数传递的不同（把实参复制给形参的过程）
6.数据类型强制转化和隐式转化的分别怎么使用？
数值:1.Number(参数) 把任何的类型转换为数值类型2.parseInt(参数1，参数2) 将字符串转换为整数3.parseFloat() 将字符串转换为浮点数字符串:1.String(参数),可以将任何的类型转换为字符串2.toString(),调用的格式 对象.toString(), 作用是将对象以字符串的方式来表示布尔类型:1.Boolean() 可以将任何类型的值转换为布尔值函数:isNaN( ) 该函数会对参数进行隐式的Number()转换，如果转换不成功则返回true;alert() 输出的内容隐式的转换为字符串隐式转换:在js中，当运算符在运算时，如果两边数据不统一，CPU就无法计算，这时我们编译器会自动将运算符两边 数据做一个数据类型转换，转成一样的数据类型再计算 这种无需程序员手动转换，而由编译器自动转换的方式就称为隐式转换
7.let const 和 var 的区别 ？
var定义的变量，没有块的概念，可以跨块访问, 不能跨函数访问。let定义的变量，只能在块作用域里访问，不能跨块访问，也不能跨函数访问。const用来定义常量，使用时必须初始化(即必须赋值)，只能在块作用域里访问，而且不能修改。
8.箭头函数和普通函数的区别 ？
1)外形不同：箭头函数使用箭头定义，普通函数中没有
2)普通函数可以有匿名函数，也可以有具体名函数，但是箭头函数都是匿名函数。
3)普通函数可以用于构造函数，以此创建对象实例,但是箭头函数不能用于构造函数，不能使用new
4)箭头函数的 this 永远指向其上下文的 this ，任何方法都改变不了其指向，如call() , bind() , apply();普通函数的this指向调用它的那个对象
9.解释什么叫回调地狱 以及怎么解决回调地狱 ？
地狱回调概念：回调函数套回调函数的情况就叫做回调地狱，
Promise 解决方式 Async/await 解决方式
10.说明原生ajax的实现步骤？
1.创建对象
2.设置回调函数
3.设置请求地址
4.设置open()方法
5.设置请求头（GET请求可以忽略这一步）
6.发送请求
11.什么情况下会导致跨域以及怎么解决跨域？
以下任意一种情况不同都会导致跨域：协议不同： http://子域名不同：www主域名不同：baidu.com端口号不同：8080ip地址和网址不同：www.baidu.com
跨域解决方法：1、jsonp 2、cors跨域资源共享 3、设置document.domain 4、用Apache做转发（逆向代理），让跨域变成同域
12.vue 有几个生命周期 以及各个生命周期的调用时机 ？
beforeCreate:创建Vue实例前的时候执行;
created:创建Vue实例完成后执行;
beforeMount:Vue实例开始渲染前执行;
mounted:Vue实例渲染完成后执行;
beforeUpdate:Vue实例修改前执行;
updated:Vue实例修改完成后执行;
beforeDestroy:Vue开始消亡前执行;
destroyed:Vue实例消亡后执行;
activated:组件激活时调用。该钩子在服务器端渲染期间不被调用;
deactivated:组件停用时调用。该钩子在服务器端渲染期间不被调用;
errorCaptured:当捕获一个来自子孙组件的错误时被调用。此钩子会收到三个参数：
错误对象、发生错误的组件实例以及一个包含错误来源信息的字符串。此钩子可以返
回 false 以阻止该错误继续向上传播。
13. 使用vue中的v-for时,为什么要绑定 :key? 如果不绑定会有什么效果？
Vue的v-for不绑定key，默认行为和绑定key="index"是差不多的，官方没有默认这
种行为的情况下，会导致所有列表DOM重新渲染。key="index"这种行为无法最大化
性能，比如在第一个元素插入新元素，会导致所有列表DOM重新渲染。绑定key后，发
现绑定的key值的元素变化了，就重新渲染该元素，而不是全部元素都重新渲染，会
提高性能。性能主要是DOM渲染影响。key绑定id一类的唯一键好处就是在列表中插入
某个元素，不会像index那样导致后面的元素全部重新渲染，而是根据绑定id的元素
是否变化渲染。
14.v-show 和 v-if 的作用和区别, v-bind 和 v-model的作用和区别？
v-if和v-show的区别:实现方式:v-if为DOM渲染属性, 通过添加删除DOM节点实现;v-show通过样式的display控制标签的显示，正因为实现方式上
面有差异，导致了他们的加载速度方面产生了差异;加载性能:v-if加载速度更快;v-show加载速度慢;切换开销:v-if切换开销大;v-show切换开销小;一般来说,v-if有更高的切换开销，而v-show有更高的初始渲染开销。因此，如果需要非常频繁地切换，则使用v-show较好，如果在运行时条件很少改变，
则使用v-if较好。v-bind和v-model的区别:v-bind：动态地绑定一个或多个特性,或一个组件 prop 到表达式使用v-bind的是使用父组件的值(根据属性名),没有使
用v-bind的是将标签里的数值当做字符串来使用v-model:在表单控件或者组件上创建双向绑定,会根据输入变化
15.vue 组件通信如何实现，至少列举3种方式并说明各自的局限性？
1.props 和 emit 父传子 子传父
父子组件传值:父组件通过props向下传递数据给子组件。注：组件中的数据共有三种形式：
data、props、computed
2.$attrs / $listeners$attrs与 $listeners 是两个对象， $attrs 里存放的是父组件中绑定的非
Props 属性， $listeners里存放的是父组件中绑定的非原生事件。
4.Bus总线在组件中，可以使用$emit， $on， $off 分别来分发、监听、取消监听事件;
16.详细说明vue组件中 data ，computed 和 watch的区别？
data：初始组件的时候data拿到的是store的值是还没有输入过的原始值,点击按钮
的时候，取data中的值是原始值，不能自己更新。
computed:换成计算属性时，是当值发生变化的时候，从新计算，不变化的时候拿到
的是之前缓存的值。
watch:默认第一次加载不做监听，如果需要第一次加载做监听，添加immediate属性，
设置为true（immediate:true）
17.keep-alive的作用是什么？ 使用它的目的是什么？
作用:包裹动态组件时，会缓存不活动的组件实例,主要用于保留组件状态或避免重新
渲染。
目的:可以使被包含的组件保留状态,或避免重新渲染## 18.vue-router的作用是什么？ 为什么不使用a标签？
Vue的创新之处在于，它利用虚拟DOM的概念和diff算法实现了对页面的"按需更新"，
Vue-router很好地继承了这一点，重渲染是我们不希望看到的，因为无论跳转到哪个
页面，只需要渲染一次就够了。<Link>组件帮助我们实现了这个愿望
反观<a>标签，每次跳转都得重渲染一次，在一个浩大的项目里，这多么可怕！我们
的"渲染"做了许多"无用功"，而且消耗了大量弥足珍贵的DOM性能！
19.vuex 是什么？ 怎么使用？为什么要使用它？
vuex:Vuex是一个专为vue.js应用程序开发的状态管理模式。它解决了组件之间同一
状态的共享问题。因为它采用的是集中式存储管理应用的所有组件状态，所以组件就
可以和store通讯了。其实Vuex就是用来管理组件之间通信的一个插件
20.请谈一下你对 使用原生js开发和 使用vue开发的看法。(至少20字以上)
JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页
添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。通常JavaScript脚本
是通过嵌入在HTML中来实现自身的功能的。
vue就是一个js库，并且无依赖别的js库，跟jquery差不多。vue的核心库只关注视
图层，非常容易与其它库或已有项目整合。Vue.js是一个轻巧、高性能、可组件化的
MVVM库，同时拥有非常容易上手的API。
web前端开发笔试题相关推荐
- 2014年最新web前端开发面试题
2014年最新web前端开发面试题 本文是一份非常不错的2014年web前端开发工程师的面试题集锦,并附有参考答案,推荐大家参考下. 试题目录: HTML 部分 CSS 部分 JavaScript 部 ...
- web前端开发面试题，都是整理出的精华
正在发愁如何成为一名开发工程师的同学,你们现在最需要做的就是除了看一些相关的面试题,还需要知道面试的一些技巧,在面试之前就了解好你即将要面试的企业,了解他们的文化,这样都可以让你的面试成功率大大的提高 ...
- 【理论面试篇】收集整理来自网络上的一些常见的 经典前端、H5面试题 Web前端开发面试题...
##2017.10.30收集 面试技巧 5.1 面试形式 1) 一般而言,小公司做笔试题:大公司面谈项目经验:做地图的一定考算法 2) 面试官喜欢什么样的人 ü 技术好. ...
- web前端开发面试题(九)
前端开发面试题第九天 一.HTML 部分 1.1 对语义化标签的理解 在学习HTML阶段的最后,我们会涉及到学习语义化标签,明明用div等标签就可以构成页面,那么为什么还会有语义化标签的存在? 语义化 ...
- Web前端开发面试题---HTML+CSS
一.HTML+CSS 1.对WEB标准以及W3C的理解与认识 答:标签闭合.标签小写.不乱嵌套.提高搜索机器人搜索几率.使用外 链css和js脚本.结构行为表现的分离.文件下载与页面速度 ...
- web前端开发面试题（答案）
1.xhtml和html有什么区别? HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言 最主要的不同: XHTML 元素必须被正确地嵌套. XHTML 元素必须被关闭. 标 ...
- Day17:web前端开发面试题
1.JavaScript 数据类型有哪些? JavaScript 变量能够保存多种数据类型:数值.字符串值.数组.对象等等: var length = 7; // 数字 var lastName = ...
- web前端开发面试题(一)
一.html部分 1.1 link和@import 区别如下: 1.1.1从属关系区别 @import是 CSS 提供的语法规则,只有导入样式表的作用:link是HTML提供的标签,不仅可以加载 CS ...
- 前端开发面试题总结之——JAVASCRIPT（一）
___________________________________________________________________________________ 相关知识点 数据类型.运算.对象 ...
最新文章
- 在WebStorm里面搜索文件中出现的中文字符
- 【原创】oracle的归档模式
- Ubuntu 18.04 固定ip 设置方法
- 迅雷第四季度净亏损3240万美元 环比亏损幅度扩大
- leetcode 35. 搜索插入位置(二分法搜索失败的情况)
- OpenGL基础28：模型
- Windows Mobile 获取来电号码和屏蔽来电
- Android代码如何监控apk安装 卸载 替换
- Android View 如何测量
- PS自定义形状+笔刷添加打造完美水印
- qq扫描用户文件传腾讯服务器,QQ被传窃取用户浏览器隐私，腾讯称为判断恶意登录而读取的数据...
- 计算机视觉注意力机制-Attention
- java dao 是什么_dao java是什么
- 实验室信息化管理LIMS 系统常见功能
- md文档插入gitlab仓库图片
- html中的div是什么意思
- C++之一些事一些情--写在前面
- Vue3 新特性 内置组件 ＜Teleport＞
- Linux 初始化 init 系统（Systemd）
- LXC、LXD、Docker的区别与联系