2019年08月_田江

转载 2019年7月全国程序员工资统计

本统计采集了某网站7月发布的程序员招聘信息，并统计如下。工资又涨了月工资 4 12807 5 13041 6 13255 7 13609 招聘人数招聘人数持续减少月...

2019-08-27 19:35:13 1093 1

原创前端面试题：vue 的双向数据绑定原理，v-model的源码

一、双向绑定：在vue中，使用指令v-model来实现双向绑定，双向绑定的意思是：表单改变，数据也改变，数据改变，表单也改变，以下为示意图：二、示例代码：<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title&g...

2019-08-21 17:55:55 2887 2

原创前端面试题：事件防抖，函数节流，事件防抖和函数节流的区别

一、事件防抖： 1、本来事件的触发比较频繁,但是,我们只希望这无数次的事件触发中,有部分事件是有效的（如：用户有短暂的停止时才调用函数）。特别是在触发一次，就发一次请求，会有无数次的抖动。如: 键盘事件：onkeydown,onkeyup,onkeypress,oninput，都是按一次键,触发一次.触发非常频繁。 2、使用场景:搜索框(百度搜索框，淘宝，京东等...

2019-08-21 17:22:20 2522

原创前端面试题：bind，call和apply的区别

一、文字描述：1、相同点：三个函数都会改变this的指向（调用这三个函数的函数内部的this）2、不同点：1)、bind会产生新的函数，（把对象和函数绑定死后，产生新的函数）2)、call和apply不会产生新的函数，只是在调用时，绑定一下而已。3)、call和apply的区别，第一个参数都是要绑定的this，apply第二个参数是数组（是函数的所有参数），c...

2019-08-21 16:51:25 10307 4

原创前端面试题：如何给一个数组添加一个自定义方法

1、了解prototype JavaScript中的prototype属性到底是啥意思？2、给官方对象（类）Array增加方法，也是使用prototype<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta na...

2019-08-21 16:29:29 875

原创 vue调试工具vue-devtools安装及使用

一、为什么要使用vue-devtools由于用vue脚手架写的源代码，运行时，先经过webpack打包，打包后的结果和我们的源代码不一样，所以，没法调试程序，没法看的数据的变化，在google中调试非常费劲。Vue-devtools工具是专门为vue项目使用过程中设计的调试工具。有了这个工具，就可以在google浏览器的控制台里看到当前组件的模板结构和data。如下图所示(左边是当前组件...

2019-08-18 19:12:22 6676 6

转载 Response的Header属性详解

Response的Header属性详解一、Header属性二、Header属性分类1、通用信息头2、请求头3、响应头4、实体头5、扩展头三、Response设置Header属性1、控制浏览器禁止缓存当前文档内容2、控制浏览器过期的时间期限3、设置http响应头控制浏览器定时刷新网页(refresh)4、设置http响应头控制浏览器定时跳转到其它页面...

2019-08-09 15:44:46 12324

原创前端面试题：webpack中loader和plugin的区别

一、从功能作用的角度区分：1、loader： loader从字面的意思理解，是加载的意思。由于webpack 本身只能打包commonjs规范的js文件，所以，针对css，图片等格式的文件没法打包，就需要引入第三方的模块进行打包。 loader虽然是扩展了 webpack ，但是它只专注于转化文件（transform）这一个领域，完成压缩，打包，语...

2019-08-08 22:42:24 19101 2

在Vue项目中，引入到工程中的所有js、css文件，编译时都会被打包进vendor.js，浏览器在加载该文件之后才能开始显示首屏。若是引入的库众多，那么vendor.js文件体积将会相当的大，影响首屏的体验。解决方法是，将引用的外部js、css文件剥离开来，不编译到vendor.js中，而是用资源的形式引用，这样浏览器可以使用多个线程异步将vendor.js、外部的js等加载下来，达到加速首开...

2019-08-08 21:25:25 1721

转载移动 H5 首屏秒开优化方案探讨

随着移动设备性能不断增强，web 页面的性能体验逐渐变得可以接受，又因为 web 开发模式的诸多好处(跨平台，动态更新，减体积，无限扩展)，APP 客户端里出现越来越多内嵌 web 页面（为了配上当前流行的说法，以下把所有网页都称为 H5 页面，虽然可能跟 H5 没关系），很多 APP 把一些功能模块改成用 H5 实现。虽然说 H5 页面性能变好了，但如果没针对性地做一些优化，体验还是很糟糕的...

2019-08-08 21:21:28 557

原创面试题：jQuery的fire函数是什么意思

//fire()函数。// callbacks.fire() 函数用于传入指定的参数调用所有的回调。// 此方法返回一个回调对象到它绑定的回调列表。//fire()函数。// callbacks.fire() 函数用于传入指定的参数调用所有的回调。// 此方法返回一个回调对象到它绑定的回调列表。 function testf1(str){ console.log("t...

2019-08-08 17:20:18 1117

原创面试题：jQuery的队列，队列可以用在哪些地方

一、队列是什么？队列是一种数据结构，跟生活中的排队是一样的,符合先进先出,后进后出的原则即:对一个数组做一些限制：1、只允许在后面插入数据,只允许在前面删除数据2、不允许在后面删除数据,也不允许在前面插入数据,也不允许在中间随便插入和删除数据.二、jQuery的队列函数：queue();jQuery的队列中存放的是函数。 .clearQueue() ...

2019-08-08 10:49:00 818

原创面试题：jQuery 的属性拷贝(extend)的实现原理是什么，如何实现深拷贝？

一、jQuery.extend() 函数用于将一个或多个对象的内容合并到目标对象。语法$.extend( target [, object1 ] [, objectN ] )指示是否深度合并$.extend( [deep ], target, object1 [, objectN ] )警告:不支持第一个参数传递 false 。参数 ...

2019-08-07 16:42:25 1938 1

原创面试题：深拷贝和浅拷贝(超级详细，有内存图)

这篇文章竟然写了一上午，亲，请怀着感恩的心阅读！！深拷贝和浅拷贝是经常在面试中会出现的，主要考察你对基本类型和引用类型的理解深度。我在无数次的面试中，应聘者还没有一个人能把这个问题回答情况，包括很多机构的培训老师。这篇文章会让你把基本类型和引用类型的区别搞得清清楚楚，搞清楚这两者的区别，你对任何编程语言的都不怕，因为，这不是js一门语言，是任何编程语言中都需要掌握的知识，而...

2019-08-07 13:07:34 91770 63

原创内存分区

任何编程语言的内存分区几乎都是一样的内存是存储数据的，不同类型的数据要存储在不同的区域，即分类存放，不同的区域作用和功能也不一样。就像你家里的衣柜一样，也分了不同的区域：如挂西装的区域，放袜子的区域等等，我相信每个人都会把这两个东西放在不同的区域。要不然，当你西装革履地参加一个高档的宴会，手塞在裤兜里，掏出来一只臭袜子，是不是很尴尬！！！哈哈！！！以下为内存的分...

2019-08-07 10:24:39 10177 5

转载最全整理浏览器兼容性问题与解决方案

常见浏览器兼容性问题与解决方案　　所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。在大多数情况下，我们的需求是，无论用户用什么浏览器来查看我们的网站或者登陆我们的系统，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。　　在学习浏览器兼容性之前，我想把前端开发人员划分为两类：　　第一类是精...

2019-08-06 17:01:24 13566 1

原创 pc端和移动端的区别

1、操作方式不同PC端的操作方式与移动端已经有了明显的差别，PC端使用鼠标操作，操作包含滑动、左击、右击、双击操作，操作相对来说单一，交互效果相对较少。而对于手机端来说，包含手指操作点击、滑动、双击、双指放大、双指缩小、五指收缩和苹果最新的3Dtouch按压力度，除了手指操作外还可以配合传感器完成摇一摇、陀悬仪感应灯操作方式，操作方式更加的丰富，通过这些丰富的操作可设计不同新颖吸引人的交互...

2019-08-06 15:09:28 13951 2

原创面试题：点透事件

一、先上一段代码大家直观地看看现象（可以复制，在浏览器中打开）<!DOCTYPE html><html><head><style type="text/css">#box {position: relative;}#box1 {po...

2019-08-06 14:51:00 2615

原创页面的重排和回流（提升移动端网页性能）

一、重绘重排的概念：重绘的意思是：重新绘制，如：颜色发生变化，重排（回流）的意思是：重新排列，即布局会受影响，如：用js动态改变了元素的宽或高，就会影响其它元素的位置，这叫重新排列。二、什么时候引起重绘，什么时候引起重排：1、重排（回流）：回流这一阶段主要是计算节点的位置和几何信息，那么当页面布局和几何信息发生变化的时候，就需要回流。比如以下情况：页面一开始渲染的时候（这肯...

2019-08-05 20:38:21 1846

原创关于DOM重排重绘性能__createDocumentFragment和拼接html字符串的方式

解释：let fragment = document.createDocumentFragment()；//fragment是一个指向空DocumentFragment对象的引用DocumentFragments是DOM节点。它们不是主DOM树的一部分。通常的用例是创建文档片段，将元素附加到文档片段，然后将文档片段附加到DOM树。在DOM树中，文档片段被其所有的子元素所代替。因为文...

2019-08-05 16:59:42 634

转载移动端性能优化

一、移动网站加载速度缓慢的原因1、网站服务器网站服务器（比如软件），默认情况下运行缓慢，或者尚未针对加载速度最大化进行合适的配置2、虚拟主机解决方案移动网站被托管于一个相对缓慢的虚拟主机解决方案（或硬件）中，或者这个网站流量非常高，经常超出虚拟主机可以处理的流量水平。3、网站浏览器缓存移动网站尚未被配置使用网站浏览器缓存4...

2019-08-05 15:30:27 907 3

原创 webpack打包（主要是处理html文件），并启动服务器

这篇文章主要说一下，如何在webpack打包过程中，处理html文件。项目目录结构现在需要，通过webpack打包后，把所有的打包结果放在项目目录下的build目录下，直接启动webpack-dev-server进行运行。一、安装插件：1、ExtractTextPlugin： npm iextract-text-webpack-plugin --save-dev2、h...

2019-08-02 20:07:39 3962

jiang7701037的博客