- 博客(60)
- 收藏
- 关注
RSS订阅原创 Event Loop
队列 queen1）Macro event queue : MacroTask2）Micro event queue: MicroTaskMacroTask和MicroTaskJavaScript引擎对这两种队列有不同的处理，先把所有的任务分类1）macroTask: setTimeout, setInterval, setImmediate, requestAnimationFr...
2018-09-27 20:26:32
255
原创 内存和硬盘的区别
https://m.zol.com.cn/article/5782258.html与计算机组成原理来分析，手机和电脑并没有本质的区别，主体结构依然为：输入设备、存储器、运算器、控制器、输出设备，至于外围的存储设备实际上是一个辅助，称之为辅助存储器，只是因为人们对结果有更多的需求，所以它又成为人们似乎，看得见、摸得见的最重要组成部分–‘存储’。 存储器存储器是用来存储程序和数据...
2018-07-23 20:11:40
3924
原创 typeof & instanceof
typeof 用于判断基本数据类型，有七种：number string boolean undefined object Function symbol注意 是当到类型不属于object 时才会给出详细情况类型，而且这个结果不会返回null使用： typeof （s）instanceof 用于判断某个实际属于哪种类型，比较准确的判断方法有ob...
2018-07-04 09:55:24
272
原创 事件冒泡和事件捕获
事件捕获事件被从目标元素的所有祖先元素依次往下传递,直至到达目标元素后，到达后，它会接着通过DOM节点再进行冒泡.事件冒泡：当事件在某一个DOM 元素被触发时，事件将会跟随着该节点的各个父节点一直向上冒泡，直至遇到该事件类型的处理器的节点为止 // W3C event .stopPropagation() // Internet Explore event.ca...
2018-07-04 09:52:26
397
原创 内存泄漏和垃圾回收机制
内存泄漏程序运行的时候需要内存，只要程序提出要求，操作系统就要给它分配内存，而随着持续的运行这些进程，必须及时释放不再用到的内存，否则轻则影响系统性能，重则导致进程崩溃。不再用到的内存，没有及时释放，就叫做内存泄漏（memory leak）。 垃圾回收机制“引用技术” 如果一个值得引用次数是0 ，则表示这个值不再被用到，因此这块内存就可以释放。 WeakSe...
2018-07-04 09:39:41
481
原创 原型
区别 构造器，函数，对象实例在js 中，构造器就是函数，函数就是构造器，对象实例就是通过 new 关键字，生成的一个实例。 function a(id) { this.id = id; } a.prototype.name = '原型'; var obj = new a(2);分析：...
2018-06-20 19:55:11
199
原创 单线程
单线程JavaScript的主要用途是与用户互动，以及操作DOM，这决定了它只能是单线程单线程就意味着，所有任务需要排队，前一个任务结束，才会执行后一个任务。比如 setTimeOut 规定在一定时间后才执行函数，如果时间很长，会使得网络闲置，JavaScript语言设计者意识到，这时主线程完全可以不管 setTimeOut 函数，选择挂起这些处于等待中的任务，先运行排在后面的...
2018-06-20 17:29:12
11713
原创 居中的实现（水平、垂直）
垂直居中【1】 line-height 实现单行文本垂直居中line-height表示两条基线之间的距离两段段文本之间的距离，也就是行高 p { line-height: 50px; background-color: sandybrown; }如果没有其他因素的干扰，文本会被一个content area box包裹,它的大小由字体...
2018-06-14 21:05:02
374
原创 CSS3---flex
http://www.cnblogs.com/xiaohuochai/p/5437503.htmlhttp://www.cnblogs.com/xiaohuochai/p/5438791.htmlhttp://www.cnblogs.com/xiaohuochai/p/5441210.html明天先理解弹性盒模型 http://www.ruanyifeng.com/blog/2015...
2018-06-14 19:36:37
136
原创 HTTPS
HTTPS 是什么？是安全的超文本传输协议，基于HTTP开发，用于在客户端和服务器之间交流信息。HTTPS 应用了SSL（安全套接字层）作为HTTP应用层的子层 （HTTP OVER SSL/TSL），SSL运行在TCP/IP层之上、应用层之下，为应用程序提供加密数据的安全通道HTTPS使用端口443， HTTP使用端口80进行通信HTTPS是由SSL+HTTP协议构建的可进行...
2018-06-11 12:32:59
671
原创 四种数组去重
var arr = [1,5,8,93,3,4,4,4,3,2,5,8,9,11];one 简单粗暴，把每一个数都与其后边的每一个数比较，相同的则删掉后面重复的 function distinct(arr) { let alen = arr.length; for(let i = 0;i<a...
2018-06-07 21:22:01
443
原创 闭包
function A(){ var text="hello world"; function B(){ console.log(text); } return B; } var c=A(); c(); // hello world 定义（1）闭包是指可以访问其所在作用域的函数，即需要通过...
2018-06-05 14:48:46
187
原创 CSS 实现左侧固定，右侧自适应两栏布局
&amp;lt;style&amp;gt; .outer { overflow: hidden; height:150px; border: 1px solid red; } .fix { width: 200px; height: 150px; background: #BCE...
2018-06-05 14:18:44
857
原创 BFC
https://blog.csdn.net/liuliuliu_666/article/details/70847566https://www.w3cplus.com/css/understanding-css-layout-block-formatting-context.htmlhttps://developer.mozilla.org/zh-CN/docs/Web/JavaScrip...
2018-06-05 13:47:49
9961
原创 强缓存、协商缓存
强缓存客户端第一次向服务器请求资源时，服务器返回某个资源的同时，添加某些头部信息，告诉客户端将资源保存在本地，并在未来的某个时点之前再次请求这个资源时，直接从本地获取就可以了。【字段控制】Expires： 代表缓存资源的过期时间，一个绝对时间的GMT格式的时间字符串浏览器再次请求这个资源时，会先从缓存中找到这个资源，然后获取Expires时间与当前的请求时间比较，如...
2018-06-04 18:54:19
389
原创 浏览器的缓存机制
cookiecookie 机制web程序是使用http协议来传输数据的，而它是一种无状态的协议，一旦数据交换完毕以后，客户端与服务器端的连接就会断开，再次交换数据需要重新建立连接，这么说的话就无法跟踪到上一次连接的会话（ 例如即用户A购买了一件商品放入购物车内，当再次购买商品时服务器已经无法判断该购买行为是属于用户A的会话还是用户B的会话了）因此要跟踪该会话，首先就出现了coo...
2018-06-04 15:32:04
459
1
原创 前端知识篇——（八）
目录CSS 题目：box-sizingJS 题目： let &amp;amp;amp;amp;amp; var &amp;amp;amp;amp;amp; const 的区别其他 题目： 性能优化有哪些 CSS 题目：box-sizing（1） 盒模型html页面的结构都是由一系列HTML标签构成，页面上的每个html元素，都被解析为一个矩形盒，而CSS盒模型就是这种矩形盒的解构模型。CSS盒模型，它由内到外、被四条边界Co...
2018-06-02 08:58:48
254
原创 JS 中的跨域问题
什么是同源http://www.ruanyifeng.com/blog/2016/04/same-origin-policy.htmlhttps://www.cnblogs.com/yongshaoye/p/7423881.htmlhttps://www.jianshu.com/p/1b1842fdfd73顶级域名 二级域名 三级域名...
2018-05-30 15:55:37
182
原创 改变函数作用域（call、 apply 、bind）
call、 aply 、bind 三种方法的第一个参数都是this的上下文apply第二个参数是数组，call和bind后面都是参数列表call和apply默认会自动执行，bind需要在后面加()来自动执行bind是ES5语法，它是新创建一个函数，然后把它的上下文绑定到bind()括号中的参数上，然后将它返回this 的指向（this 永远指向最后调用它的那个对象，箭头函数...
2018-05-30 14:12:25
1469
2
原创 变量的作用域
var a=10;function aaa(){ alert(a); var a=20;}aaa(); //结果为：undefined var a=10; function aaa(a){ alert(a); var a=20; } aaa(a); // 10【第一种】 函数内部可以解析为 functi...
2018-05-30 13:02:01
280
原创 border 取none 与 0 的区别
border:none 与 border:0 1）性能上的差异：【border:0】 效果相当于border-width：0，浏览器依然对border-width、border-color进行了渲染，即已经占用了内存值。【border:none】效果等同于border-style:none，浏览器解析“none”时将不作出渲染动作，即不会消耗内存值。2）兼容性差异：...
2018-05-30 10:11:06
1014
原创 vertical-align 与 line-height
对于行内元素： 行高就是它的外边界 基线是字符恰好位于其上的那条线，基线总是穿过字体高度一半以下的某一点 字体高度行内块元素： 外边界即其行高 基线取决于元素是否包含流内内容： （1）有流内内容的行内块元素：基线就正常流中最后内容元素的基线 （2）无流内内容 或者 有流内内容但overflow属性值不是visible的行内块元素 ：基线与行内块元...
2018-05-29 21:17:45
456
原创 chrome 开发者工具——长截图
长截图1.打开开发者工具使用快捷键组合：Alt + Command+ I (Mac) 或 Ctrl + Shift + I (Windows)打开命令行Command + Shift + P(Mac) 或 Ctrl + Shift + P (Windows)寻找制定命令输入“Screen” ，找到“Capture full size screenshot”并...
2018-05-23 23:45:19
3847
转载 javascript 执行上下文
执行上下文函数每调用一次，都会产生一个新的执行上下文环境。因为不同的调用可能就有不同的参数。function fn(x) { console.log(arguments) console.log(x)}fn(20)fn(10) // 不同的调用可能有不同的参数执行上下文栈执行全局代码时，会产生一个执行上下文环境，每次调用函数都又会执行上下文环境。当函数调用完成...
2018-05-18 22:27:21
144
原创 移动端 300毫秒延迟
移动端Click300毫秒点击延迟来源：07年，当时的网站都是为大屏幕设备所设计，为了实现对普通网页更好的体验，苹果的工程师对 iPhone 这种小屏幕浏览桌面端站点，定义了一个双击缩放(double tap to zoom) 的功能，原理是，当你点击一次之后，在300ms内检测是否再有一次点击，如果有的话，就会缩放页面；否则的话就是一个单击行为。解决方案：（1）设置不能...
2018-05-10 18:21:15
1480
原创 canvas 第一课
简单使用绘制简单的线、形状 canvas.getContext('2d'): 返回一个用于在画布上绘图的环境 context.beginPath(); 开始当前路径 context.moveTo(100,100); 开始绘制点 context.lineTo(150,200); 结束绘制点 ...
2018-05-09 23:42:01
202
原创 前端知识篇——（七）
目录CSS 题目：改变 placeholder 的字体颜色大小JS 题目： Set &amp; Map 数据结构 其他 题目： 认识动画效果 CSS题目：改变 placeholder 的字体颜色大小&lt;style&gt;input::-webkit-input-placeholder { /* WebKit browsers */ ...
2018-04-16 23:10:34
187
原创 对象
1.对象定义方式 2.类型 对象定义方式文字语法形式：(现实中用的比较多)var myobj = { key : value };构造形式var myobj = new Object();myobj.key = value; 数据类型js中有6种数据类型：string 、boolean、 number 、null、 undefined...
2018-04-14 10:17:54
153
转载 图片
【1】矢量图与位图 - 矢量图是通过组成图形的一些基本元素，如点、线、面，边框，填充色等信息通过计算的方式来显示图形的。比如描述一个圆可以通过它的圆心位置和半径来描述优点：文件相对较小，并且放大缩小不会失真缺点：这些完美的几何图形很难表现自然度高的写实图像。- 位图又叫像素图或栅格图，它是通过记录图像中每一个点的颜色、深度、透明度等信息来存储和显示图像。一张位图就好比一幅大的拼图，只不过每个拼块都...
2018-04-13 14:44:31
135
原创 携程——前端笔试
这里我将会总结在携程笔试过程中遇到的选择题。 1：for(var i =1;i&lt;=3;i++){ setTimeout(function(a){ console.log(a); }(i),0) }; // 1 // 2 // 3 解析： 基础知识...
2018-04-13 11:12:11
2431
1
原创 this 全面解析
this 的指向this 是在函数被调用时发生的绑定，它指向什么完全取决于函数在哪里被调用注意: this 不指向函数本身，也不指向函数的词法作用域 绑定规则默认绑定 无法应用其他规则时的默认规则 function foo(){ console.log(this.a); } var a...
2018-04-04 20:21:55
222
原创 JS--------（一）
目录1.声明函数的方法 声明函数的方法 三种：函数的声明、函数表达式、Function 构造函数（1）函数的声明function print(s) { console.log(s);}（2）函数表达式匿名函数赋值给变量。这时，这个匿名函数又称函数表达式，因为赋值语句的等号右侧只能放表达式。采用函数表达式声明函数时，function命令后面不带...
2018-03-31 22:22:40
153
原创 小项目总结（一）
一个小练习后的总结前阵子在慕课网上找了一个视频来练手，是制作移动端的一个贺卡界面，那是一个小的项目，但是所谓“麻雀虽小五脏俱全”，老师带我们过了一遍简单而又基本完整的开发流程： 1、需求分析、开发技能分析、再到性能优化分析，这一步完成开发的前期分析准备； 2、切图，获取图片等资源； 3、重构，编写网页的结构； 4、前端界面，包括表现层、行为层、交互层等； 5、优化；在这个项目的过...
2018-03-28 21:35:49
450
原创 前端知识篇——（六）
目录HTML 题目： X-UA-CompatibleCSS 题目： vw vhJavaScript 题目： forEach，for-in，for-of HTML题目：X-UA-Compatible<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">这是IE8的专用标记,用来指...
2018-03-28 18:51:57
128
原创 前端知识篇——（五）
目录CSS 题目： 自适应布局与响应式布局 JavaScript 题目： 继承与原型链 其他 题目：前端开发、交互、视觉 CSS题目： 自适应布局与响应式布局 自适应布局自适应是为了解决如何才能在不同大小的设备上呈现相同的网页。根据屏幕的宽度，自动调节网页的内容大小，但是无论怎么样子，他们的主体的内容和布局是没有变化的。 自适应设计是基于断点使用静态布局，一...
2018-03-23 16:41:00
236
原创 前端知识篇——（四）
HTML 题目：meta标签CSS 题目：css 实现单行、多行文本溢出显示省略号 JavaScript 题目：继承机制其他：dom load 与 dom ready 的区别 HTML 题目：meta标签<!-- 设置缩放 --><meta name="viewport" content="width=device-width, initial-...
2018-03-15 20:48:20
213
1
原创 ES6——（四）
目录 ：（十四）数组的扩展 （十五）对象的扩展 （十四）数组的扩展这里我整理了 ES5 与 ES6 中关于数组的扩展ES5array.forEach(callback[,thisObject ]) 数组循环第一个参数是一个回调函数，并且这个回调函数有默认的参数，分别是 value、index、array自身 let arr = [1,2,4];...
2018-03-14 23:19:00
229
原创 ES6——（二）
目录： （八）字符串 （九）正则的扩展 （十）数值的扩展 （十一） Math 对象的扩展 （八）字符串字符串的遍历器接口// 使得字符串可以被for...of循环遍历for (let codePoint of 'foo') { console.log(codePoint)}// "f"// "o"// "o"a...
2018-03-11 23:44:36
172
原创 ES6——（一）
目录：一、ECMAScript 和 JavaScript 的关系 二、ES6 与 ECMAScript 2015 的关系 三、Let 四、const 五、const & let 六、作用域 七、解构赋值 一、ECMAScript 和 JavaScript 的关系ECMAScript 和 JavaScript 的关系是，前者是后者的规格，后...
2018-03-11 18:33:38
261
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人