面试题
关注
分享
扫一扫
dou_xiaobao
白羊座的女程序猿
展开
-
前端面试题总结1-JavaScript基础
一、JavaScript基础1、变量和类型（1）JavaScript规定了几种语言类型JavaScript中的每一个值都有它自己的类型，JavaScript规定了七种语言类型：①Undefined②Nulls③Boolean④String⑤Number⑥Symbol⑦.Object（2）JavaScript对象的底层数据结构是什么js基本类型数据都是直接按值存储在栈中的(Undefined、Null、不是new出来的布尔、数字和字符串)，每种类型的数据占用的内存空间的大小是确定的，原创 2020-11-02 16:47:52 · 481 阅读 · 0 评论 -
ES6的箭头函数，参数扩展以及解构赋值
1、箭头函数，就是函数的简写 ①如果只有一个参数，() 可以省 ②如果只有一个return，{}可以省// 普通函数function name() {}// 箭头函数，去掉 function， 加上 =>() => {}let show1 = function () { console.log('abc')}let show2 = () => { console.log('abc')}show1() // 调用函数 abcshow2.原创 2020-10-28 11:41:50 · 452 阅读 · 0 评论 -
ES6中定义变量以及简介
1、变量 let 和 常量 const(1)原来定义变量 var 存在的的问题① 可以重复声明，没有报错和警告② 无法限制修改③没有块级作用域， { }(2)let 和 const① 不能重复声明② 都是块级作用域, { } 块内声明的，块外无效③ let 是变量，可以修改④ const 是常量，不能修改⑤ 块级作用域举例<!DOCTYPE html><html lang="en"><head> <meta charset="U原创 2020-10-27 17:29:01 · 323 阅读 · 0 评论 -
ES6之生成器函数generator
1、generator 生成器函数简介（1）普通函数，一路执行到底（2）generator函数，中间可以停，到哪停呢，用 yield 配合，交出执行权。yield 有放弃、退让、退位的意思。需要调用next()方法启动执行，需要遇到 yield 停, 踹一脚走一步generator函数前面加一个 * 两边可以有空格，或靠近函数或function实际生成多个小函数，实现走走停停的效果。function show() { console.log('a') console.log('原创 2020-10-27 15:07:51 · 218 阅读 · 0 评论 -
ES6之Promise详细介绍
1、简介ECMAscript 6 原生提供了 Promise 对象。Promise 对象代表了未来将要发生的事件，用来传递异步操作的消息。promise本身是同步的，promise的回调then是异步的let oP = new Promise( (res, rej) => { console.log(1);});console.log(2);//结果：1// 22、具体应用（1）① 异步和同步 异步，操作之间没有关系，同时执行多个操作， 代码复杂 同步原创 2020-10-27 11:11:53 · 348 阅读 · 2 评论 -
ES6之数组新增方法 （map，reduce，filter，forEach）
对于数组，ES6中新增4个很实用的方法，分别有：map ，reduce，filter，forEach。接下来我们来一一讲解。1、map 映射 一个对一个let arr = [6，10，12, 5, 8]let result = arr.map(function (item) { return item*2})let result2 = arr.map(item=>item*2) // es6的箭头函数简写，若想了解，后面的文章有介绍console.log(result)cons原创 2020-10-26 16:09:42 · 546 阅读 · 3 评论 -
浏览器从输入 URL 到页面加载显示完成，这个过程中都发生了什么？
浏览器从我们输入 URL 到页面加载显示完成展示出我们想看到的结果页面和功能，中间主要经历了以下几个步骤，概括为：(DNS解析）=> ①(TCP连接:三次握手) => ②(发送HTTP请求) => ③(服务器处理请求并返回HTTP报文) => ④(浏览器解析渲染页面) => ⑤(连接结束：四次挥手) => ⑥具体每个步骤的详解如下：1、浏览器根据请求的URL交给DNS域名解析，找到真实IP。DNS（Domain原创 2020-09-11 14:29:42 · 2508 阅读 · 0 评论 -
浏览器缓存机制之cookie localStorage sessionStorage
Web Storage 是对 Cookie 的拓展一、cookie简介Cookies是一种能够让网站服务器把少量数据储存到客户端的硬盘或内存，或是从客户端的硬盘读取数据的一种技术。一般记住密码，下次自动登录，购物车功能，记录用户浏览数据，进行商品（广告）推荐等场景下使用~（现在基本大多数登录的合法性验证都是用cookie验证的）。优点优点：兼容性最好，几乎所有的浏览器都支持缺点1、Cookie 存储空间小，仅为4kb；2、过多的 Cookie 会带来巨大的性能浪费因为Cookie 是紧跟域原创 2020-09-11 12:22:58 · 568 阅读 · 0 评论 -
如何改变url并且页面不进行刷新
如何改变url并且页面不进行刷新？1、location.hash（哈希方式）控制台里面输入：location.hash=‘aaa’,则地址栏里会相应的变化，并且不会刷新页面2、html5中 history的对象修改url，也不会刷新页面history.pushState(对象参数，title参数，url）之前的地址变成了bbb，并且#就没有了history.back() 相当于返回上一级url ===【 history.go(-1) ==> 跳到特定顺序的url】history.原创 2020-08-19 15:03:10 · 2739 阅读 · 0 评论 -
DOM事件流
1、DOM事件的级别DOM0：element.onclick = function(){}DOM2: element.addEventListener(‘click’, function(){}, false)DOM2: element.addEventListener(‘keyup’, function(){}, false)默认是false，是在冒泡中触发，true为在捕获中触发。2、DOM事件模型3、DOM事件流4、描述DOM事件捕获的具体流程同理，事件冒泡的流程也是一样的道原创 2020-08-11 17:58:27 · 155 阅读 · 0 评论 -
js面试题（原型链、面向对象、去重、排序）
原型链类1、创建对象有几种方法(1) A：var o1 = {name: ‘o1’}(1) B：var o1 = {name: ‘o1’}(2) var M = function(){this.name = ‘o2’} var o2 = new M()(3)var P = {name: ‘o3’} var o3 = Object.create§2、原型，构造函数，实例，原型链!3、instanceof 的原理4、new运算符...原创 2020-08-11 17:55:26 · 610 阅读 · 0 评论 -
面试题之CSS盒模型
面试题之CSS盒模型1、基本概念（1）标准模型 （宽、高）= content 的宽高（2）ie模型（宽、高）= content 的宽高 + padding 的宽高 + border 的宽高2、CSS如何设置这两种模型3、JS如何设置获取盒模型对应的宽和高4、解决盒模型边距重叠—BFC（1）BFC的基本概念（2）创建BFC的方式（3）BFC的使用场景1、基本概念基本概念：标准模型 + ie模型（1）标准模型 （宽、高）= content 的宽高（2）ie模型（宽、高）= content 的宽高 + p原创 2020-08-05 15:31:44 · 1675 阅读 · 0 评论 -
面试题—首尾固定中间高度自适应实现的4种方式
首尾固定中间高度自适应实现的4种方式1、定位postion2、弹性布局—flex3、表格布局—table4、网格布局—grid1、定位postion<!DOCTYPE HTML><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, minimum-原创 2020-08-05 12:37:52 · 577 阅读 · 0 评论 -
不固定高宽div垂直居中的方法
不固定高宽div垂直居中的方法1、伪元素和 inline-block / vertical-align<style> .box-wrap:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-right: -0.25em; //微调整空格 } .centered { display: inline-block; vertical-al原创 2020-08-04 18:36:38 · 722 阅读 · 0 评论 -
固定宽高的div垂直居中
css中固定宽高div垂直居中的实现方式假设外层div宽高均为600px；内层宽高均为200px；代码如下:<style> .box { width: 600px; height: 600px; background-color:#f00; position: relative; } .box > div { width: 200px; height: 200px; background-color: #ff0; position:原创 2020-08-04 16:47:16 · 329 阅读 · 0 评论