natalie86的专栏

/*在基于数组原型扩展*/Array.prototype.getRandom = function(range) {    //防止长度越界    range = range > this.length?this.length:range;     var newArray = [].concat(this), //拷贝原数组进行操作,否则会影响原数据

队列是只允许在一端进行插入操作，另一个进行删除操作的线性表，队列是一种先进先出（First-In-First-Out，FIFO）的数据结构队列在程序程序设计中用的非常的频繁，因为javascript单线程，所以导致了任何一个时间段只能执行一个任务，而且还参杂了异步的机制，那么带来的问题：1. 在异步操作执行的时候，同步代码还在继续，那么同步代码依赖异步，自然就会出错

一、前言    国内做HTML5页面，关注最多就是微信分享了，之前也写过关于微信分享的文章，可以点击查看：分享相关文章    再者，就是国内的其它分享，比如常用的新浪微博、腾讯微博、QQ空间等等，最方便的就是直接用百度的分享插件，但是在移动端感觉这个插件太多了，没必要，而且还要请求baidu。后来发现，这些分享其实都可以通过url的参数来实现，拿一些常用的分享举个例子：

Javascript确实是调试者的噩梦，很难理解错误，给出的行号也往往无用，那么有没有一个常见错误诊断和修复列表呢？马上来，请接着看！下面是我总结的JS奇怪错误列表，鉴于不同浏览器相同错误的错误提示不同，我们给出了一些不同的示例。如何阅读错误首先，我们简要看一下错误提示的结构，以便于我们更好的理解错误，以便将来更好的应对列表未列的错误。一个典型的错误提示貌似如此，Uncaugh

我们可以看到在javascript概念中的队列与栈都是一种特殊的线性表的结构，也是一种比较简单的基于数组的顺序存储结构。由于javascript的解释器针对数组都做了直接的优化，不会存在在很多编程语言中数组固定长度的问题(当数组填满后再添加就比较困难了，包括添加删除，都是需要把数组中所有的元素全部都变换位置的，javascript的的数组确实直接给优化好了，如push,pop,shift,unsh

KMP算法和BM算法KMP是前缀匹配和BM后缀匹配的经典算法，看得出来前缀匹配和后缀匹配的区别就仅仅在于比较的顺序不同前缀匹配是指：模式串和母串的比较从左到右，模式串的移动也是从 左到右后缀匹配是指：模式串和母串的的比较从右到左，模式串的移动从左到右。通过上一章显而易见BF算法也是属于前缀的算法，不过就非常霸蛮的逐个匹配的效率自然不用提了O(mn)，网上蛋疼的KMP

JavaScript中不区分整数和浮点数，所有数字内部都采用64位浮点格式表示。但实际操作中比如数组索引、位操作则是基于32位整数。方式一、使用取余运算符判断       任何整数都会被1整除，即余数是0。利用这个规则来判断是否是整数。function isInteger(obj) {    return obj%1 === 0}is

String.IndexOf  String.IndexOf 方法 (Char, Int32, Int32)报告指定字符在此实例中的第一个匹配项的索引。搜索从指定字符位置开始，并检查指定数量的字符位置。String.IndexOf(value, startIndex, count)参数value：要查找的 Unicode 字符。 startIndex：搜索起始位置。

数据结构与算法JavaScript这本书算是讲解得比较浅显的，优点就是用javascript语言把常用的数据结构给描述了下，书中很多例子来源于常见的一些面试题目，算是与时俱进，业余看了下就顺便记录下来吧git代码下载：https://github.com/JsAaron/data_structure.git栈结构特殊的列表，栈内的元素只能通过列表的一端访问，栈顶后入

串是由零个或多个字符组成的有限序列，又叫做字符串串的逻辑结构和线性表很相似的，不同的是串针对是是字符集，所以在操作上与线性表还是有很大区别的。线性表更关注的是单个元素的操作CURD，串则是关注查找子串的位置，替换等操作。当然不同的高级语言对串的基本操作都有不同的定义方法，但是总的来说操作的本质都是相似的。比如javascrript查找就是indexOf, 去空白就是trim,转化大

正则表达式用于字符串处理、表单验证等场合，实用高效。现将一些常用的表达式收集于此，以备不时之需。匹配中文字符的正则表达式： [\u4e00-\u9fa5]评注：匹配中文还真是个头疼的事，有了这个表达式就好办了匹配双字节字符(包括汉字在内)：[^\x00-\xff]评注：可以用来计算字符串的长度（一个双字节字符长度计2，ASCII字符计1）匹配空白行的正则表达式：

随着商业及其相关需求的发展，数据成为越来越重要的元素之一，为了更加直观和明显的展示商业潜在的趋势和内在的特性，我们需要使用图表和图形的方式来直观动态的展示数据内在秘密，在今天的这篇文章中我们推荐12款最棒的数据可视化的Javascript框架，希望能够帮助大家在项目中更好的实现数据可视化效果。ECharts提起ECharts，经常使用开源软件的朋友应该很熟悉，当然，如果你不知道也没

Javascript中call的使用自己感觉蛮纠结的，根据文档很好理解，其实很难确定你是否真正的理解。call 方法应用于：Function 对象调用一个对象的一个方法，以另一个对象替换当前对象。call([thisObj[,arg1[, arg2[,   [,.argN]]]]])参数：thisObj 可选项。将被用作当前对象的对象。 arg1, ar

浏览器对于我们来说，可能是最熟悉的工具了。记得最早那会Netscape，到后来的Internet Explorer一统江湖，再到现在的FireFox大行其道，浏览器市场的争夺，可谓是硝烟弥漫。除了我们常见的IE, Firefox, Opera, Safari四大金刚以外，新近又出了一位Chrome，虽然新出，但是出于Google这个名门，Chrome所受到的关注绝不亚于先前的四大金刚，看来以后

变量……1.一个变量只存一种类型的数据，2.尽量减少对隐式转换的依赖，这样可增强程序的可读性，日后修改程序时不至于混乱，3.使用匈牙利命名法，4.使用局部变量时记得加 var 进行声明，不然会与全局变量冲突，网站性能优化方面1.在对当前DOM进行操作之前，尽可能多的做一些准备工作，保证N次创建，1次写入。2.在对DOM操作之前，把要操作的元素，先从当前D

JavaScript 本身可以算是一门简单的语言，但我们也不断用智慧和灵活的模式来改进它。昨天我们将这些模式应用到了 JavaScript 框架中，今天这些框架又驱动了我们的 Web 应用程序。很多新手开发者被各种强大的 JavaScript 框架吸引进来，但他们却忽略了框架身后浩如星海的 JavaScript 实用技巧。本文将为你呈献其中七个基础知识点：1. 在 String.proto

事件源对象 event.srcElement.tagName event.srcElement.type捕获释放 event.srcElement.setCapture();  event.srcElement.releaseCapture();  事件按键 event.keyCode event.shiftKey event.altKey event.ctrlKe

英文原文 How to Write Maintainable OO JavaScript Code，翻译：Yao Xiao能够写出可维护的面向对象JavaScript代码不仅可以节约金钱，还能让你很受欢迎。不信？有可能你自己或者其他什么人有一天会回来重用你的代码。如果能尽量让这个经历不那么痛苦，就可以节省不少时间。地球人都知道，时间就是金钱。同样的，你也会因为帮某人省去了头疼的过程而获

这是stackoverflow上的一个老问题，却有个干货答案，但是扩展的信息量很大，我只在此抛个砖。Not jQuery. Not YUI. Not 等等…js的框架的确很有用，但是它们却常常把一些js的丑陋细节和DOM原理给你隐藏了。如果你的目标是做一个精通javascript的工程师，那花大把的时间放在框架上可能恰恰背道而驰了。下面就有javascript这门语言的一些

讲解this指针的原理是个很复杂的问题，如果我们从javascript里this的实现机制来说明this，很多朋友可能会越来越糊涂，因此本篇打算换一个思路从应用的角度来讲解this指针，从这个角度理解this指针更加有现实意义。下面我们看看在java语言里是如何使用this指针的，代码如下：1234567

JavaScript就在这里随时等候你的召唤，但是也许你还没有准备好如何使用他。为什么不用jQuery呢？因为它很慢并且你的网站真的不需要这些多余的负担。我不是来这里争辩原生API和函数库的迥异，开发的时候很难不用到这些神奇的东东。但是我想讨论的是：如果仅为使用个选择器($)或者类似的东西，是否真的有必要加载jQuery。假设咱不是为了简化，每个人用jSomething是因为它支持

这是stackoverflow上的一个老问题，却有个干货答案，但是扩展的信息量很大，我只在此抛个砖。Not jQuery. Not YUI. Not 等等…js的框架的确很有用，但是它们却常常把一些js的丑陋细节和DOM原理给你隐藏了。如果你的目标是做一个精通javascript的工程师，那花大把的时间放在框架上可能恰恰背道而驰了。下面就有javascript这门语言的一些

在JavaScript中，作用域、上下文、闭包、函数等算是精华中的精华了。对于初级JSer来说，是进阶必备。对于前端攻城师来说，只有静下心来，理解了这些精华，才能写出优雅的代码。本文旨在总结容易忘记的重要知识，不会讲基本的概念。如果对基本知识不太熟悉，就去翻下《Javascript权威指南》吧~参考文章如下(建议读者朋友用chrome看这些文章吧，不然的话会错过很多精彩哦~)：

如你所知，JavaScript是世界上第一的编程语言，它是Web的语言，是移动混合应用（mobile hybrid apps）的语言（比如PhoneGap或者Appcelerator），是服务器端的语言（比如NodeJS或者Wakanda），并且拥有很多其他的实现。同时它也是很多新手的启蒙语言，因为它不但可以在浏览器上显示一个简单的alert信息，而且还可以用来控制一个机器人（使用nodebot，

1、!!将一个值方便快速转化为布尔值console.log( !!window===true );2、不声明第三个变量实现交换var a=1,b=2;a=[b,b=a][0];//执行完这句代码之后 a的值为2 b的值为1了3、&&和||的用法 （学会了立马感觉高大尚了吧）用代码说话吧var day=(new Date).getDay(

1、避免全局查找在一个函数中会用到全局对象存储为局部变量来减少全局查找，因为访问局部变量的速度要比访问全局变量的速度更快些 function search() { //当我要使用当前页面地址和主机域名 alert(window.location.href + window.location.host);

我们先来看看回弹滚动在手机浏览器发展的历史：    - 早期的时候，移动端的浏览器都不支持非body元素的滚动条，所以一般都借助 iScroll;    - Android 3.0/iOS解决了非body元素的滚动问题，但滚动条不可见，同时iOS上只能通过2个手指进行滚动；    - Android 4.0解决了滚动条不可见及增加了快速回弹滚动效果，不过随后这个特性又被移除

写在前面一直非常谷歌的控制台，因为我是做前端的，谷歌浏览器在我看来是解析JS最快的浏览器，所谓的熟能生巧，用熟悉了谷歌浏览器之后就特别喜欢用谷歌的控制台调试脚本、改变样式、查看HTML、查看资源加载等信息。在这儿推荐两篇关于谷歌控制台怎么使用的三篇博文（在我看来这三篇博文是我看过介绍谷歌控制台最佳最全的使用手册啦）Chrome 控制台不完全指南Chrome 控制台c

使用HTML和CSS构建三维世界去年，我做了一个程序示例，来展示CSS的三维转换功能如何被用于创建三维环境的。在当时，这个例子是一个关于通过CSS能够达到什么效果的示例，但是我想要看自己能在这件事情上走多远，所以，在过去的这几个月中，我做了一个新版本。该版本有更多复杂的模型、更真实的光线、阴影和冲突检测机制。本文记录了我的制作方法以及使用的技术。创建一个三维对象在当今的3D

欢迎来到 Git 101。学习 Git 的第一条规则就是，你不能谈及自己在学习 Git1。因为这个工具由 Linus Torvalds 主导的 Linux 内核社区设计开发，并且由最酷最炫的 GitHub 发扬光大，从头到脚围绕着高大上的光环，全世界聪明的程序员都会用（至少声称自己会用）它来管理自己的代码。如果你在跟人聊天时不经意透露了自己「正在学习使用 Git」，无疑所有人都会投来高贵冷艳充

今天我要将关注点放到页面渲染以及其重要性上。虽然已经有很多文章提到过这个主题了，但大部分信息都是零碎的片段。为了思考这件事情，我需要研究很多信息的来源。这也就是为什么我觉得我应该写这篇文章的原因。我相信这篇文章对新手会很有用，并且对想刷新和巩固他们已经了解的东西的高手也同样适用。渲染应该从最开始当页面布局被定义时就进行优化，样式和脚本在页面渲染中扮演着非常重要的角色。专业人员知道一些技巧以

A useful tools or tips list for mobile web application developinggithub地址：https://github.com/jtyjty99999/mobileTech

JavaScript是一种描述型脚本语言，它不同于 Java 或 C# 等编译性语言,它不需要进行编译成中间语言,而是由浏览器进行动态地解析与执行。如果你不能理解 JavaScript 语言的运行机制，或者简单地说，你不能掌握JavaScript 的执行顺序，那你就犹如伯乐驾驭不了千里马，让千里马脱缰而出，四处乱窜。　　那么JavaScript是怎么来进行解析的吗？它的执行顺序又是

在训练中，我们介绍了一些工具和库，以扩大其代码的能力。目前有位 JavaScript 学员 ，他汇总了这些工具的清单，想分享给其他的代码爱好者。       我们利用 Kalina 的清单，画了一张有帮助的思维导图： 通用        脚手架工具（用于启动项目）Yeoman – Yeoman 是一个健壮且固定的客户端程序库，

译自：http://javascriptissexy.com/javascript-objects-in-detail/ 译者：生如夏花  转载请注明转自natalie86博客       第一次翻译老外的一篇长博文。不少地方还是不太确定怎么翻妥当，也许等以后更深入理解了就知道怎么翻了。但还是受益匪浅，博文写得很细，很好地帮助你理解一些较难理解的点。翻译不当地方，欢迎大家拍砖。  ja

移动端基本没有:active的概念，因为不像鼠标，会有经过状态，但是并不代表移动端的:active是没有的    要CSS伪类 :active 生效，只需要给 document 绑定 touchstart 或 touchend 事件    具体代码：style>a {  color: #000;}a:active {

1、关闭iOS键盘首字母自动大写IOS的机子，默认英文输入法状态下，首字母是自动大写的，有时候挺烦人的。我们写页面的时候有没有办法把这个自动大写关闭呢？autocapitalize的属性可以实现：    在iOS中，默认情况下键盘是开启首字母大写的功能的，如果业务不想出现首字母大写，可以这样：input type="text" autocapit

在做移动端页面的时候，经常会遇到需要获取屏幕的高度和宽度，进行一些特殊效果的处理或者兼容。比如在做全屏滑动上下翻页的效果（不出现滚动条），这种就需要页面加载时获取到屏幕的高度，然后才能定义，每一屏的高度。以前做pc页面时，才会说这个高度的获取会有兼容问题，clientHeight、offsetHeight 和scrollHeight的各种讨论和兼容处理已经很多了。但是在移动端，主要还是考虑webk

note：在html 标签类中的checkbox实现单选效果。       在最近的开发项目中，客户要求使用小方格子实现“单选”功能，显然圆点的radio被out了，只能选择chckbox的方块样式，也在网上搜过，可能有点儿脑残，没有找到。       废话不多说直接上代码：            checkbox实现单选效果           

Object类型是JavaScript中使用最多的一种类型。创建Object实例的方式有多种，接下来一一列举。1. Object构造函数var person = new Object();person.name = "Brittany";person.age = 23;person.job = "web front-end engineer"