JavaScript-ES3
文章平均质量分 86
刻刻帝丶
这个作者很懒,什么都没留下…
展开
-
JavaScript条件语句的性能问题
条件语句和循环一样,条件语句同样会改变运行流 JavaScript的条件语句分为两种if-elseswitchif-else是我们最常用的了 不过if-else语句与switch语句很多情况都能够互相替换if(foo){ ...}else{ ...}switch(foo){ case true: ... default:原创 2016-11-06 21:03:27 · 1579 阅读 · 0 评论 -
浅析JavaScript设计模式——迭代器模式
迭代器模式 提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示迭代器模式不像我们上次讲的代理模式 它十分简单,简单到我们可能都不认为它是一种设计模式 因为我们现在使用的语言基本上内部都实现了自己的迭代器 迭代器可以抽取内部的逻辑,我们不需要知道对象内部长什么样 就可以按顺序访问它内部的元素自定义迭代器ES5中给我们的数组扩展了很多原型方法、 其中就有一个好原创 2016-11-18 14:19:48 · 1489 阅读 · 0 评论 -
JavaScript中容易忽视的高效操作——位操作
很多JavaScript的书都很少提到位操作 包括一些字典型的都讲的很少 因为它真的是几乎用不到 第一次接触位运算的时候,还是在学习C语言的时候 位操作是计算机底层的操作,所以它的运算速度非常快位操作JavaScript中数字都是64位格式存储的 我们在位操作的时候,数字被转换为32位数字, 于是位运算就是直接操作这32位数 虽然需要转换,但是位运算仍然要更加迅速 顶级原型中的toS原创 2016-11-18 19:58:23 · 1536 阅读 · 0 评论 -
浅析JavaScript设计模式——策略模式
策略模式 定义一系列算法,把它们一个个封装起来,并且使它们可以相互替换在我们的生活中,想要达到一种目的可以有不同的方法 所谓“条条大路通罗马” 在我们的程序中,想要实现一种目的的方法也可能不同 所以就引入了我们的策略模式举一个原创 2016-11-09 13:54:51 · 1222 阅读 · 0 评论 -
七种方案解决JavaScript交换两个变量值的问题
刚才写位操作的时候突然想到了这个问题 突然想总结一下 交换变量值的问题可能使我们学习编程语言接触到的比较早的逻辑问题 可能有些小伙伴只会两种var a = 123;var b = 456;今天我总结七种办法来交换a和b的变量值交换变量值方案一最最最简单的办法就是使用一个临时变量了 不过使用临时变量的方法实在是太low了var t;t = a;a = b;b = t;首先把a的值存储到原创 2016-11-18 21:47:52 · 13040 阅读 · 2 评论 -
轻量级数据格式——JSON
今天这数学实在看不下去 来换换脑子,写写前端 今天就写一个小知识JSON在很久很久以前,XML是互联网上传输数据的标准 但是大家普遍反映XML太繁琐 再后来,随着Web的发展 人们发现JSON作为JavaScript语法的子集使用更方便 于是JSON就成为了标准 现在大家都把JSON作为通信的数据格式JSON基本语法(JSON:JavaScript Object Notation,Ja原创 2016-12-01 21:42:07 · 2808 阅读 · 6 评论 -
浅析JavaScript设计模式——发布-订阅/观察者模式
观察者模式 定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知前一段时间一直在写CSS3的文章 一直都没写设计模式 今天来写写大名鼎鼎观察者模式 先画张图观察者模式的理解我觉得还是发布-订阅模式的叫法更容易我们理解 这就类似我们在微信平台订阅了公众号 当它有新的文章发表后,就会推送给我们所有订阅的人我们可以看到例子中这种模式的优点我们作为原创 2016-11-26 18:58:35 · 18782 阅读 · 1 评论 -
原生JavaScript实现的简易计算器
最近一直没有写博客 因为一直忙着预习考试内容 什么偏微分啊、数值分析啊、计算机图形学啊、信息论… 在未来一个月可能会很忙 整理前端的频率可能就没那么高了还是说正题 昨天晚上用JavaScript实现了一个简易的计算器 今天分享给大家没有考虑什么兼容,浏览器为chrome 代码我放在了我的github上 大家可以前往下载 传送门 或者复制我下面展示的代码这个计算器长成这个样子(43原创 2016-11-29 20:54:48 · 30118 阅读 · 1 评论 -
HTML5优化Web动画——requestAnimationFrame
在页面中实现动画,我们有很多选择 可以使用CSS3的transition CSS3中的animation配合keyframes规则 SVG中也可以使用SMIL-animation 最原始的方法就是我们利用JavaScript的setTimeout/setInterval来实现动画 不过现在我们又多了一种方法 requestAnimationFrame优势requestAnimationF原创 2017-01-17 17:46:08 · 2351 阅读 · 0 评论 -
HTML5客户端数据存储Web Storage——localStorage与sessionStorage
HTML5提供了在客户端存储数据的新方法Web Storage 类似于HTML4中的Cookie 不过它要强大的多Cookie先来简单复习一下之前使用的cookiecookie存储数据到用户设备上,存储的数据量较小只有4KB 可以通过navigator.cookieEnabled检测是否开启了cookie设置cookie document.cookie = 'key=value';获取co原创 2017-01-18 00:02:21 · 3906 阅读 · 2 评论 -
JavaScript闭包
闭包是JavaScript很重要的知识点闭包在JavaScript的世界中无处不在掌握了它能够使我们对JavaScript理解的更加深入闭包是基于词法作用域书写代码时所产生的必然结果词法作用域可以理解为就是静态的作用域,就是书写代码时, 变量属于哪个作用域就已经定下来了原创 2016-10-24 20:03:54 · 1411 阅读 · 0 评论 -
JavaScript中表示空的undefined与null的区别及用法
我刚开始学习JavaScript的时候 就感觉undefined挺新鲜 因为其他语言没有 而且不仅有undefined,居然还有一个表示空的null 相信很多同学都说不出来undefined与null有什么区别 今天我就总结一下JavaScript中表示空的undefined与null的区别相似undefined和null是JavaScript中的基本类型 并且它们的类型值各只有一个,就原创 2016-11-07 17:19:07 · 2157 阅读 · 0 评论 -
浏览器UI多线程及对JavaScript单线程底层运行机制的理解
早在我刚刚学习JavaScript的时候,我就被灌输了这样的思想 JavaScript是单线程的 可是在我不断的学习过程中 学到了定时器、ajax的异步加载 一度让我对这句话产生怀疑 既然JavaScript是单线程的,为什么它还存在异步加载 后来我知道了浏览器中不仅仅有js一个线程,它与其他线程共同组成了 —– 浏览器UI多线程早就想写一篇这样的文章,只是感觉理解的还不够,怕我写的对大原创 2016-11-04 22:00:11 · 3702 阅读 · 0 评论 -
JavaScript扫雷游戏mineClearance
这个扫雷游戏是当年(去年)我刚学完JavaScript后自己做的一个练习小项目 不算html、css也有近1000行的代码 时隔一年,现在一看当时写的仍然有不成熟的地方现在拿出来希望对一些初学的小伙伴有所帮助功能及界面如下游戏难度选择游戏时间及剩余雷数记录双击或鼠标滑轮键智能扫雷如果点击的方格上的数字和周围插旗的数量相等 那么周围没有点开的方格都会被点开 (不相等就会有×的动画)失败界面胜利原创 2017-05-08 22:54:56 · 3330 阅读 · 9 评论 -
JavaScript预编译原理分析
今天用了大量时间复习了作用域,预编译等等知识 看了很多博文,翻开了以前看过的书 发现当初觉得自己学的很明白,其实还是存在一些思维误区 今晚就整理了一下凌乱的思路 先整理一下预编译的知识吧,日后有时间再把作用域详细讲解一下大家要明白,这个预编译和编译是不一样的 JavaScript是解释型语言, 既然是解释型语言,就是编译一行,执行一行 传统的编译会经历很多步骤,分词、解析、代码生成什么原创 2016-10-27 23:06:34 · 22853 阅读 · 19 评论 -
浅析JavaScript设计模式——代理模式
代理模式 为一个对象提供一个代用品或占位符,以便控制对它的访问好久没有写设计模式的文章了 今天要写的代理模式可能内容要多一些 代理模式非常有用,代理模式也分为很多很多种,我只谈一些常见并且简单的 思想其实都是一样的 代理这个词我们并不陌生,在生活中例子也很多,比如,经纪人… 当我们不方便直接访问一个对象或者访问对象不满足我们需求的时候 我们可以把这个对象的控制权交给一个代理对象,原创 2016-11-17 20:33:54 · 2559 阅读 · 0 评论 -
JavaScript匿名、具名函数与立即执行函数IIFE详解
JavaScript中的函数作用域的存在就是为了把变量和函数“隐藏”起来 符合我们的最小特权原则 同时它的另一个好处是可以避免同名标识符的冲突 今天主要来谈谈这个立即执行函数 在此之前的复习一下匿名函数与具名函数匿名函数与具名函数无论是匿名还是具名,都是针对函数表达式来说的 函数声明那就必须得有名字了,否则会报错的function foo(){ //函数声明 //...} 这原创 2016-11-12 11:49:49 · 4905 阅读 · 2 评论 -
JavaScript日期对象常用方法及应用
感觉我这个标题也的很大 其实日期对象并不常用,应用好像也不多 但是我们需要了解一些基本的用法日期对象Date日期对象是js原生的构造函数 不像数组、对象什么的,它没有对应的常量形式 创建一个日期对象很简单var date = new Date();Date()可以带参数,指定日期和时间 不带参数就是使用当前的日期和时间Date()主要是用来获取当前的时间戳(距离1970年1月1日的毫秒数)原创 2016-11-06 19:10:22 · 1858 阅读 · 0 评论 -
JavaScript的提升行为及原理分析
对于刚刚学习JavaScript的同学,可能它的一些行为让你刚到疑惑 和你在学校学过的C/C++差很多 比如说这样的情况a = 1;var a;console.log(a);// 1有些同学可能会认为应该是undefined才对,var a好像给a重新赋值了 再如这样的情况console.log(a);// undefinedvar a = 1;a还没声明就打印,应该是报错才对啊,或者参原创 2016-11-05 20:53:10 · 1166 阅读 · 0 评论 -
原生JavaScript与jQuery(绝对、相对定位)实现拖拽效果
今天给大家谈谈这个拖拽功能的实现 一是想复习一下这个小知识,二是看到网上都是absolute绝对定位实现的,感觉有一定局限性 所以自己写了一下用relative相对定位来实现的拖拽效果原生js绝对定位实现拖拽首先我们来思考一下拖拽功能用到的事件 拖拽无非是鼠标按下点击物体(DOM节点) 鼠标移动,物体移动 鼠标抬起,物体停止拖拽 所以这里我们需要绑定三个事件 mousedown、mou原创 2016-11-03 21:54:58 · 7368 阅读 · 0 评论 -
JavaScript中的七种值类型与typeof运算符
打算从基础开始复习JavaScript, 顺便分享总结一下自己学过的知识内置类型JavaScript中有七种内置类型,包括六种基本类型和一种引用类型基本类型number(数字)string(字符串)boolean(布尔值)undefined(未定义)null(空值)symbol(符号)【ES6规范新增】引用类型object(对象)其中基本类型是保存在栈内存中的简单数据段,在内存中有原创 2016-11-02 22:56:10 · 1573 阅读 · 0 评论 -
JavaScript判断变量是否为数组的方法
数组是编程语言中最基本而且重要的数据结构 在我们JavaScript中,数组是特殊的对象 有时候我们就会遇到判断数组的问题 今天我给大家整理一下哪些方法能够判断一个变量是否是数组instanceofvar arr = [1,2,3];console.log(arr instanceof Array);//trueinstanceof运算符会检测arr是否继承自Array.prototype原创 2016-10-30 15:41:02 · 1907 阅读 · 0 评论 -
JavaScript深层克隆对象
今天做题看到了深层克隆对象,并且要求在原型链上编程 于是心血来潮索性来复习一下这个知识点克隆对象,这名词看着高大上,其实也没什么,便是拷贝一个长的一模一样的对象 也许有初学的小伙伴在想,那还不简单么,so easyvar obj1 = {name: 'payen'};var obj2 = obj1;这可并不是克隆对象,obj1和obj2根本就是同一个对象, 他俩指向同一个内存地址空间,拿到了原创 2016-10-26 22:37:57 · 3656 阅读 · 5 评论 -
JavaScript中的原型继承
JavaScript语言是面向对象的语言, 但是它是基于原型的面向对象语言 这和C++等一些语言不同, 它实际上并没有”类”, 不能实例化”类”原型编程的基本原则:所有的数据都是对象得到一个对象,并不是通过实例化类,而是找到一个对象作为原型并继承它对象会记住它的原型如果对象无法响应某个请求,它会把这个请求委托给自己的原型下面就来我们就来看看JavaScript是怎样以这样的规则构建对象的原创 2016-10-25 19:05:39 · 1234 阅读 · 0 评论 -
JavaScript队列、优先队列与循环队列
队列是一种遵从先进先出(FIFO)原则的有序集合 队列在尾部添加新元素,从顶部移除元素队列的理解队列在我们生活中最常见的场景就是排队了 队列这个名字也已经很通俗易懂了和栈很像,这不过队列是先入先出的数据结构 队列的前面是队头 队列的后面是队尾 出队从队头出 入队从队尾入队列的创建和栈类似,这里我就不就不啰嗦了 同样需要实现一些功能 这里我类比生活中的排队上厕所向队列中添加元素原创 2016-11-10 21:49:31 · 3396 阅读 · 1 评论 -
JavaScript栈的实现
栈是一种遵从先进后出(LIFO)原则的有序集合。 新添加的或待删除的元素都保存在栈的末尾,称作栈顶,另一端就叫栈底。 在栈里,新元素都靠近栈顶,旧元素都接近栈底昨天因为有点事没有更新,今天打算给大家讲讲JavaScript实现的数据结构 以前学C/C++的时候,感觉算法还是比较重要的,但是前端好像涉及的不多 其实作为程序员,了解一些基本算法应该是必须的栈的理解栈这种数据结构其实很好原创 2016-10-29 15:22:34 · 2026 阅读 · 0 评论 -
JavaScript内部属性[[Scope]]与作用域链及其性能问题
学习JavaScript已经很长时间了 今天打算回忆一下作用域的知识 作用域这个知识很基础并且非常重要 下面我就总结一下JavaScript中的作用域以及作用域链的相关知识作用域作用域是什么? 作用域是变量能够引用、函数能够生效的区域 它限制了你对内存空间上值的获取和修改 所有的语言都存在作用域 我们可以理解作用域为js引擎根据名称查找变量的一套规则 理解了作用域,我们才能去理解闭包原创 2016-11-08 20:09:33 · 10185 阅读 · 9 评论 -
JavaScript类型检查与内部属性[[Class]]
所有对象都包含有一个内部属性[[Class]] 我们不能直接访问这个属性,但是我们可以通过一种方法访问 这种方法就是Object.prototype.toString.call(...) 这也是比较靠谱的检查类型的方法(instanceof、constructor等等不靠谱)比如说我们检测一个数组Object.prototype.toString.call([1,2,3]);控制台打印"[ob原创 2016-11-08 10:57:08 · 3052 阅读 · 0 评论 -
JavaScript欺骗词法的eval、with与catch及其性能问题
正常来说,执行期上下文的作用域链是不会改变的 所以很多同学都认为JavaScript中只有词法作用域(静态作用域,作用域由书写代码时函数声明位置决定) 但其实有几种机制是可以欺骗词法的 它们是with()、eval()还有try-catch语句的catch语句 其中with和eval我们不应该去使用(会产生很多问题) 欺骗词法的意思就是欺骗词法作用域 也就是说,在运行时修改作用域链 这原创 2016-11-09 21:04:03 · 2686 阅读 · 1 评论 -
JavaScript循环语句的性能问题
在大部分编程语言中, 循环语句消耗了大部分时间 而循环语句又是十分重要的编程模式在JavaScript中, 有四种循环类型for循环while循环do-while循环for-in循环前三种循环在其他语言也很常见 for-in循环每次迭代同时会搜索实例或原型属性, 所以它每次迭代会产生更多开销 for-in循环最终只有其他三种类型速度的1/7 所以, 除非我们明确需要迭代一个属原创 2016-10-25 23:01:14 · 3039 阅读 · 2 评论 -
理清JS中的词法、静态、动态、函数、块作用域
额刚刚写了好多,结果被我误操作覆盖掉了,我的心血 ╥﹏╥… 没关系重新写一遍,也提醒同样在这个平台写博客并且像我一样使用markdown语言码字的同学 “保存线上到草稿”是一个好习惯,嗯嗯 今天双十一,感觉该剁手了。。很多同学在学习JavaScript的时候,可能会听说“各种各样”的作用域 什么词法作用域、静态作用域、动态作用域、函数作用域、块作用域 傻傻分不清楚 下面我就给大家理清一下原创 2016-11-11 18:52:08 · 2853 阅读 · 0 评论 -
六种方法实现JavaScript数组去重
JavaScript数组去重问题是面试(或笔试)中可能被问到的题 如果只能说出一两种方法的话,就显得我们很low 所以这里我总结了数组去重的六种方法供大家参考直接遍历首先先来一种简单粗暴的方法 也是很容易就可以想到的办法 声明一个新数组 直接遍历原创 2017-06-15 12:26:26 · 7932 阅读 · 1 评论