个人整理
路明凡
这个作者很懒,什么都没留下…
展开
-
前端 javascript 常见面试题个人整理与总结
目录基础题目JS 变量按照存储方式区分为哪些类型,并描述其特点,区分值类型与引用类型的区别JS 中使用 typeof 能得到哪些类型强制类型转换,何时使用 === 何时 使用 ==JS 中有哪些内置函数如何理解 JSON原型和原型链涉及知识点如何准确判断一个变量是数组类型写一个原型链基础的例子描述new一对象的过程写一个封装DOM查询的例子基础题...原创 2018-07-30 14:38:58 · 288 阅读 · 1 评论 -
javascript——日期、Math、数组API和对象API
日期Date.now(); //获取当前时间毫秒数var dt = new Date();dt.getTime(); //获取毫秒数dt.getFullYear(); //年dt.getMonth(); //月(0-11)dt.getDate(); //日(0-31)dt.getHours(); //小时(0-23)dt.getMinutes(); //分钟(0-59)...原创 2018-08-17 14:04:46 · 128 阅读 · 0 评论 -
javascript——DOM相关
DOM的本质浏览器把那道 html代码,结构化一个浏览器能识别并且js可操作的一个模型而已获取DOM节点DOM结构操作·新增节点·获取父元素、获取子元素·删除节点DOM是哪种基本的数据结构树DOM操作常用API有哪些获取DOM节点,以及节点的property和Attribute获取父节点,获取子节点新增节点,删除节点DOM节点的...原创 2018-08-17 19:32:33 · 137 阅读 · 0 评论 -
javascript——事件
编写一个通用的事件监听函数描述事件冒泡流程DOM树型结构事件冒泡阻止冒泡冒泡应用——代理对于一个无限下拉加载图片的页面,如何给每个图片绑定事件使用代理...原创 2018-08-17 20:43:46 · 150 阅读 · 0 评论 -
vue实现多选、单选、全选和反选
单选:利用v-for数组循环中的的index,即数组下标想法:首先定义一个标志数n,每次点击时传入index,令标志数n=index。此时,若index = n,则可以实现其他功能。 多选、全选、反选想法:这次需要在data里定义一个工具数组arr,点击事件radio,把这个index传进arr。然后之后判断arr中是否存在这个index,如果存在,则说明他是被选中的。...原创 2018-11-29 15:28:30 · 3229 阅读 · 0 评论 -
如何利用vue-cli 快速创建vue项目
首先确保已经安装成功vue-cli,没有的话在命令行敲 npm install --global vue-cli创建一个基于webpack 模板的项目如 vue init webpack test之后会出现:项目代码结构介绍test根目录.babelrc:语法解析器.editorconfig:一些编辑器设置.eslintignore:可忽略检查的文件.e...原创 2019-03-06 13:24:17 · 116 阅读 · 0 评论 -
单文件组件和vue中的路由
首先查看main.jsapp.vueapp.vue中存在一个<router-view/>标签,这里存放的就是相应路由改变该改变的网页内容查看router文件夹中的index.js按照routers数组的方式,在components文件夹下创建一个test.vue文件,导入,...原创 2019-03-06 14:02:17 · 402 阅读 · 0 评论 -
vue2.x 实现移动音乐播放器相关笔记(一)
目录结构相关解释api:存放接口相关js文件base:存放基础组件,比如移动端滑动组件,利用better-scroll做的Scroll组件等可复用组件common:存放字体、工具类js,图片,css基础样式components:存放业务相关组件,比如:首页,排行榜router:存放路由相关文件store:存放vuex相关文件webpack基础配置:将src的目...原创 2019-03-15 14:57:36 · 184 阅读 · 0 评论 -
vue2.x 实现移动音乐播放器——jsonP相关
利用js文件不会被同源政策限制的原理,解决跨域首先利用npm安装jsop的库npm install jsonp相关APIjsonp(url, opts, fn)url(String) url to fetch接口地址 opts(Object), optional param(String) name of the query string paramet...原创 2019-03-15 18:07:57 · 262 阅读 · 0 评论 -
vue2.x 实现移动音乐播放器——js工具文件
// 判断是否有该classexport function hasClass(el, className) { // 正则的意思:该className前,可以加空字符或不加,className后也可以加一个空字符或者不加 let reg = new RegExp('(^|\\s)' + className + '(\\s|$)') // js正则验证函数,.test():输入‘字符...原创 2019-03-19 13:18:27 · 148 阅读 · 0 评论 -
vue2.x 实现移动音乐播放器——scroll组件
<template> <div ref="wrapper"> <slot></slot> </div></template><script type="text/ecmascript-6">import BScroll from 'better-scroll'export defaul...原创 2019-03-19 14:01:28 · 191 阅读 · 0 评论 -
数组去重实现
利用es6的set方法 let arr = [1,2,3,4,5,1,2,3,4,5] let a = new Set(arr) console.log(a)创建一个空数组,判断arr中的元素是否存在于新数组中 let arr = [1,2,3,4,5,1,2,3,4,5] let a = [] arr.forEach((item,in...转载 2019-07-01 20:08:59 · 456 阅读 · 0 评论 -
MVC、MVP以及MVVM模式
请谈谈mvc、mvp和mvvm模式1、MVC:MVC是应用最广泛的软件架构之一,一般MVC分为:Model( 模型 )、Controller( 控制器 )、View( 视图 )。这主要是基于分层的目的,让彼此的职责分开。View一般通过Controller来和Model进行联系。Controller是Model和View的协调者,View和Model不直接联系。基...转载 2019-07-08 21:38:28 · 147 阅读 · 0 评论 -
javascript——异步和单线程
同步和异步的区别是什么?分别举一个同步和异步的例子同步会阻塞代码执行,而异步不会例子:alert是同步,setTimeout是异步 什么是异步console.log(1);setTimeout(function(){ console.log(2);},100);console.log(3);什么是同步console.log(1);alert(2);c...原创 2018-08-17 00:33:50 · 176 阅读 · 0 评论 -
javascript中的深拷贝与浅拷贝
浅拷贝:只复制指向某个对象的指针,而不复制对象本身,新旧对象还是共享同一块内存(内存区域没有隔离)深拷贝:会另外创造一个一模一样的对象,新对象跟原对象不共享内存(内存区域隔离),修改新对象不会改到原对象。在多层对象上,浅拷贝只拷贝一层。 浅拷贝举例:var Chinese = { nation:'中国'};var Doctor ={ career:'医生'}f...转载 2018-08-16 13:42:20 · 107 阅读 · 0 评论 -
前端面试——页面性能
提升页面性能的方法有哪些?1、资源压缩合并,减少H仃P请求2、非核心代码异步加载一异步加载的方式一异步加载的区别3、利用浏览器缓存一缓存的分类一缓存的原理4、使用CDN5、预解析DNS<metahttp-equiv="x-dns-prefetch-control"content="on">提前打开a标签预解析dns<linkrel="dns-prefetch"h...原创 2018-08-13 18:01:30 · 232 阅读 · 0 评论 -
5种实现3栏布局的方法(左右顶宽,高度已知,中间自适应)
5种实现3栏表布局的方法,html相同,仅改变css<section class="layout"> <article class="box"> <div class="left"></div> <div class="center"> <h1&g原创 2018-08-10 17:22:01 · 510 阅读 · 0 评论 -
css盒模型
css盒子模型的基本概念:标准模型+ie模型标准模型的宽高是content的宽高,不包括padding和border。 ie模型的宽高是包括padding和border的css是如何设置这两种模型的box-sizing:content-box (标准)box-sizing:border-box(ie)js如何获得盒子模型对应的宽高dom.styl...原创 2018-08-10 18:52:08 · 263 阅读 · 0 评论 -
DOM事件类
DOM事件的级别DOM0 : element.onclick = function() {}DOM2 : element.addEventListener = ('click',function() {},false) false是代表冒泡时触发,true代表捕获时触发DOM3 : element.addEventListener = ('keyup',function() {},...原创 2018-08-10 19:42:38 · 102 阅读 · 0 评论 -
前端面试——HTTP协议方面
HTTP全称超文本协议传输HTTP工作流程首先客户机与服务器需要建立连接。只要单击某个超级链接,HTTP的工作开始。 1.收线客户机与服务器需要建立连接,只要单击某个超级连接,http的工作开始 2.建立连接后,客户机发送一个请求给服务器,请求方式的格式为:统一资源标识符(URL)、协议版本号、后边是MIME信息包括请求修饰符、客户机信息和可能的内容。 3.服务器接到...原创 2018-08-10 20:01:30 · 5944 阅读 · 0 评论 -
前的面试——javascript原型链
创建对象的几种几种方法字面量var o1 = {name:'o1'};var o11 = new Object({name:'o11'});构造函数var M = function(){this.name='o2'};var o2 = new M();Object.create方式var P = {name:'o3'};var o3 = Object.cre...原创 2018-08-11 10:38:02 · 152 阅读 · 0 评论 -
前端面试——错误监控
前端错误的分类即时运行错误:代码错误资源加载错误(图片、css、js加载失败)错误的捕获方式即时运行错误的捕获方式1)try.catch2)window.onqrror资源加载错误(不会冒泡)1)object.onerror 2)performance.getEntries() 3)Error事件捕获延伸:跨域的js运行错误可以捕获吗,错误提示什么,应该怎么处理?...原创 2018-08-15 11:45:56 · 212 阅读 · 0 评论 -
javascript——存储
cookie本身用于客户端和服务器端通信但是它有本地存储的功能,于是就被"借用"使用document.cookie=·…获取和修改即可缺点:存储量只有4KB,所有http请求都带着,影响获取资源的效率。API需要封装才能使用locationStorage和sessionStorageHTML5专门为存储而设计,最大容量5MAPI简答易用localStorage.s...原创 2018-08-17 21:08:32 · 130 阅读 · 0 评论 -
前端面试——javascript面向对象
类与实例类的声明/*普通声明 */var Animal = function () { this.name = 'Animal';};/* es6中class的声明*/class Animal2 { constructor () { this.name = 'Animal2'; }}生成实例new Animal()new A...原创 2018-08-13 15:16:22 · 1470 阅读 · 0 评论 -
前端面试——通信
什么是同源策略和限制同源策略限制从一个源加载的文档或脚本如何与来自另一个源的资源进行交互,这是一个用于隔离潜在恶意文件的关键安全机制源:协议+域名+端口。以bilibili为例https://www.bilibili.com https为协议,www.bilibili.com为域名,一般端口的默认值为80.这3个有一个不一样都是源不一样。主要限制如下3个方面cookie、L...原创 2018-08-13 15:34:06 · 196 阅读 · 0 评论 -
前端面试——安全
CSRF基本概念CSRF,跨站请求伪造攻击原理1、网站存在接口漏洞2、用户登录过该网站防御措施Token验证Referer(页面来源)验证隐藏令牌XSS基本概念跨域脚本攻击是一种常见于web application中的计算机安全漏洞。攻击原理XSS通过在用户端注入恶意的可运行脚本,若服务器端对用户输入不进行处理,直接将用...原创 2018-08-13 15:53:55 · 709 阅读 · 0 评论 -
前端面试——渲染机制
什么是DOCTYPE及其作用什么是DOCTYPE及作用DTD(document type definition,文档类型定义)是一系列的语法规则,用来定义XML或(X)HTML的文件类型。浏览器会使用它来判断文档类型,决定使用何种协议来解析,以及切换浏览器模式DOCTYPE是用来声明文档类型和DTD规范的,一个主要的用途便是文件的合法性验证。如果文件代码不合法,那么浏览器解析时便...原创 2018-08-13 16:25:37 · 293 阅读 · 0 评论 -
前端面试——运行机制
如何理解js的单线程一个时间内js只能做一件事什么是任务队列同步任务和异步任务什么是Event Loop事件循环:将异步任务挂起,等同步任务结束再继续异步任务setTimeout和setlntervalDOM事件ES6中的Promise ...原创 2018-08-13 16:39:40 · 327 阅读 · 0 评论 -
Array数组常用方法的总结
1、forEach()forEach遍历数组,无返回值,不改变原数组,仅仅只是遍历、常用于注册组件、指令等等。 var arr = [1,2,3,4] arr.forEach(function(item, index ,arr) { console.log('item',item) console.log('index',in...原创 2019-06-30 21:15:51 · 264 阅读 · 0 评论