参加公司技术嘉年华第一季(前端.服务端)的间隙,陈导问了我一个问题:{}+[] 和 []+{}两个表达式的值分别是什么?根据我的理解我觉得结果应该都是"[object Object]",但是结果却并不是这样子的({}+[] = 0  []+{} = '[object Object]'),我就想这不科学呀,一下子颠覆了我所学过的js知识了.于是我决定搞明白这究竟是是什么与原因导致的?     通过查找资料,发现之所以结果不一样,是因为js解释器把{}当做了代码块语法解析,那么{}+[]就…
遍历对象(数组)是我们日常撸码的必不可少的部分,如何从性能上优化代码,提高运行效率?下文为你揭开真像: 第一种:普通的for循环 for(j = 0; j < arr.length; j++) { } 简要说明:最简单的一种,也是使用频率最高的一种,性能不弱,但是有优化空间 第二种:优化过的for循环(性能最高) for(j = 0,len=arr.length; j < len; j++) { } 简要说明:使用临时变量,将长度缓存起来,避免重复获取长度,当数组较大时优化效果才会比较明显.这…
浅谈JS中的!=.== .!==.===的用法和区别   var num = 1;     var str = '1';     var test = 1;     test == num  //true 相同类型 相同值     test === num //true 相同类型 相同值     test !== num //false test与num类型相同,其值也相同, 非运算肯定是false     num == str  //true 把str转换为数字,检查其是否相等.     nu…
0x00:什么是Ajax? Ajax是Asynchronous Javascript And Xml 的缩写(异步javascript及xml),Ajax是使用javascript在浏览器后台操作HTTP和web服务器进行数据交换(用户不知道也感觉不出来,就跟桌面应用程序似的进行数据交互),它不会导致页面重新加载,这样才有更好的用户体验. Ajax是基于以下开放标准: javascript(DOM) css html xml(json) 通俗的说就是使用了javascript(DOM)的XMLH…
浅谈JS中的闭包 在介绍闭包之前,我先介绍点JS的基础知识,下面的基础知识会充分的帮助你理解闭包.那么接下来先看下变量的作用域. 变量的作用域 变量共有两种,一种为全局变量,一种为局部变量.那么全局变量的作用域为: 局部变量只能在定义此变量的函数体内使用,则局部变量的作用域为定义此变量的函数体.而全局变量可以全局使用.局部变量只有在调用函数的时候存在,函数调用完成之后立马就销毁了,而全局变量会一直存在. 首先我在全局变量中定义一个变量a,var a=0;那我们了解到变量a在内存中的存储是wind…
原文:浅谈 js 正则字面量 与 new RegExp 执行效率 前几天谈了正则匹配 js 字符串的问题:<js 正则学习小记之匹配字符串> 和 <js 正则学习小记之匹配字符串优化篇>.里面讲到了优化正则起到提升性能的问题,但是能提升多少呢?于是我去测试了,发现TMD几乎微乎其微,我用千字符串进行万次匹配测试,优不优化根本没区别. 这不科学,我白看了这么多天正则,上天这是在玩弄我么. 突然我想到了 compile 方法,然后去测试了下,奇迹出现了,果然优化过的快了不少. 但这是为…
原文:浅谈 js 字符串之神奇的转义 字符串在js里是非常常用的,但是你真的了解它么?翻阅<MDN String>就可以了解它的常见用法了,开门见山的就让你了解了字符串是怎么回事. 'string text' "string text" "中文 español English हिन्दी العربية português বাংলা русский 日本語 ਪੰਜਾਬੀ 한국어" 可以看到,可以直接使用任意字符.PS: 如果的你文件编码是GBK或者A…
本文来自网易云社区 作者:刘凌阳 前言 本文依据半年前本人的分享<浅谈js拖拽>撰写,算是一篇迟到的文章. 基本思路 虽然现在关于拖拽的组件库到处都是,HTML5也把拖放纳入了标准.但考虑到兼容问题,我们还是从最古老的方式开始讲起. onmousedown:模拟开始拖拽事件.   鼠标按键按下即发生  onmousedown  事件.  获取鼠标位置,获取被拖拽元素的位置,记录两者之间的纵横坐标的差值.对  document  元素绑定  onmousemove,onmouseup  事件.…
浅谈JS中 var let const 变量声明 用var来声明变量会出现的问题: 1. 允许重复的变量声明:导致数据被覆盖 2. 变量提升:怪异的数据访问.闭包问题 3. 全局变量挂载到全局对象:全局对象成员污染问题 例1: 用var声明的变量会默认被提升到当前作用域的顶部 例2: For循环内的i变量当前所处的环境是全局作用域(函数局部作用域同理,只不过声明之后不绑定在window上). ,这就产生了闭包,如下图   ES6 中引入let 和 const,以及块级作用域来解决这个问题   什…
JS 数据类型转换 方法主要有三种 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把值转换成浮点数.只有对String类型调用这些方法,这两个函数才能正确运行:对其他类型返回的都是NaN(Not a Number). 在判断字符串是否是数字值前,parseInt()和parseFloat()都会仔细分析该字符串.parseInt()方法首先查看位置0处的 字符,判断它是否是个有效数…
JS 数据类型转换 方法主要有三种 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把值转换成浮点数.只有对String类型调用这些方法,这两个函数才能正确运行:对其他类型返回的都是NaN(Not a Number). 在判断字符串是否是数字值前,parseInt()和parseFloat()都会仔细分析该字符串.parseInt()方法首先查看位置0处的 字符,判断它是否是个有效数…
原文:浅谈 js 正则之 test 方法 其实我很少用这个,所以之前一直没注意这个问题,自从落叶那厮写了个变态的测试我才去看了下这东西.先来看个东西吧. var re = /\d/; console.log( re.test("1") ); console.log( re.test("1") ); console.log( re.test("1") ); console.log( re.test("1") ); 全部是 tru…
原文:浅谈 js 数字格式类型 很多人也许只知道 ,123.456,0xff 之类的数字格式.其实 js 格式还有很多数字格式类型,比如 1., .1 这样的,也有 .1e2 这样的. 可能有人说这是什么个格式?其实还不止呢.          //11.2       //1.21.2e3    //12001.2e+3  //12001.2e-3   //0.0012.12e+2  //12-.12e-2 //-0.0012 当然这些只是十进制.我们来说说 八进制 和 十六进制., , .…
原文:浅谈 js 语句块与标签 语句块是什么?其实就是用 {} 包裹的一些js代码而已,当然语句块不能独立作用域.可以详细参见这里<MDN block> 也许很多人第一印象 {} 不是对象字面量么?怎么成了语句块了?如果在赋值语句或者表达式里用的时候,确实是对象字面量,如: var a = {}; ({toString:function(){return "hehe"}}) + "..."; 是不是很有意思..但是直接使用如: {toString: fu…
原文:浅谈 js 字符串 trim 方法之正则篇 关于 trim 其实没啥好说的,无非就是去除首位空格,对于现代浏览器来说只是简单的正则 /^\s+|\s+$/ 就可以搞定了.而且支持中文空格   等等.什么 \s 支持 中文空格?是的. 打开 RegExp#character-classes 往下拉一点,找到 \s 这个解释. 原文:Matches a single white space character, including space, tab, form feed, line fee…
原文:浅谈 js 字符串 search 方法 这是一个很久以前的事情了,好像是安心兄弟在学习js的时候做的练习.具体记不清了,今天就来简单分析下 search 究竟是什么用的. 从字面意思理解,一个是搜索字符串吧. var str = "123456789abcde"; console.log( str.search("abc") ); // 9 确实是搜索指定字符在一个字符串中出现的位置,如果不存在就返回 -1可是这样就跟 indexOf 功能一样了,何必单独搞一…
原文:浅谈 js eval作用域 就简单聊下如何全局 eval 一个代码. var x = 1; (function () { eval('var x = 123;'); })(); console.log(x); 这个代码得到的是 1 而不是 123如果想让 eval 执行的代码是全局的,那么有几种方法. var x = 1; (function () { window.eval('var x = 123;'); })(); console.log(x); 这个方法标准浏览器都可以得到 123…
浅谈JS面向对象 一 .什么是面向过程 就是分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现,使用的时候一个一个依次调用就可以了.注重代码的过程部分. 二.什么是面向对象 最先出现在管理学中,是一种管理资源(资源等于空间)和能力(能力导致运动,运动等于时间)的方法论. 面向对象是一种思维方法 面向对象是一种编程方法 面向对象并不只针对某一种编程语言 三.面向对象和面向过程的区别和联系 “面向过程”是一种以过程为中心的编程思想. 就是分析出解决问题所需要的步骤,然后用函数把这些步骤一步…
浅谈JS严格模式 简介 何为严格模式?严格模式(strict mode)即在严格的条件下运行,在严格模式下,很多正常情况下不会报错的问题语句,将会报错并阻止运行. 但是,严格模式可以显著提高代码的健壮性,比如JS经常被人诟病的隐式创建全局变量,在严格模式下就会阻止运行. 总的来说,引入严格模式虽然会导致一些代码不可运行,但是,严格模式使得一些JS广受诟病的问题无法运行,从长期角度上看,绝对是利大于弊. 用法 进入严格模式的方法很简单,只需要在在需要进入严格模式的作用域开头输入"user stri…
一个项目中必然会遇到分页这种需求的,分页可以使数据加载更合理,也让页面显示更美观,更有层次感!那么js分页到底如何实现呢?下面我就来讲一下三种循序渐进的方法 1.自己纯手写分页 更深入的去理解分页的意义如分页的原理,其实,尝试自己去写一些分页方法是再合适不过的了,可以封装成一个分页方法,但是呢,这里呢,我就写一下最简单的指定的分页方法 ,就不去封装了.就以下图为例: 上图是个非常普通的分页.第一个文本框可以输入页码.点击Go去查询指定的页数.后面两个按钮分别是上一页和下一页.这里面就没有写第一页…
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.    背景 最近项目原因使用了durandal.js和knockout.js,颇有受益.决定写一个比较浅显的总结. 之前一直在用SpringMVC框架写后台,前台是用JSP+JS+标签库,算是很传统的MVC开发模式了.后来,前端用Flex还有微软的WPF做过开发,到这次,前端使用纯JS+HTML,利用knockout.js,也算是接触了几种语言下的MVVM模式.…
以下内容摘录自阮一峰的<语法概述 -- JavaScript 标准参考教程(alpha)>章节『数据类型转换』,以做备忘.更多内容请查看原文. JavaScript是一种动态类型语言,变量是没有类型的,可以随时赋予任意值.但是,数据本身和各种运算是有类型的,因此运算时变量需要转换类型.大多数情况下,这种数据类型转换是自动的,但是有时也需要手动强制转换. 强制转换 强制转换主要指使用Number.String和Boolean三个构造函数,手动将各种类型的值,转换成数字.字符串或者布尔值. Num…
1.    背景 最近项目原因使用了durandal.js和knockout.js,颇有受益.决定写一个比较浅显的总结. 之前一直在用SpringMVC框架写后台,前台是用JSP+JS+标签库,算是很传统的MVC开发模式了.后来,前端用Flex还有微软的WPF做过开发,到这次,前端使用纯JS+HTML,利用knockout.js,也算是接触了几种语言下的MVVM模式. 此次开发中,结合require.js和durandal.js,完成了按需加载.AMD规范以及前端页面路由.当然了,一般控件的编写…
JS继承 继承是OO语言中最为人津津乐道的概念,许多OO语言都支持两种方式的继承:接口继承:实现继承. 接口继承:只继承方法签名. 实现继承:继承实际的方法. 由于ES里函数没有签名,所以在ES里面无法实现接口继承,ES只支持实现继承.                                                                                                                                    …
JavaScript 是一种弱类型的语言,也就是没有类型限制,变量可以随时被赋予任意值. 同时,在程序运行过程中,类型会被自动确认的.因此,这就是涉及到数据的类型转换.在 JS 的世界中,数据类型转换可以分为类型的显示转换和隐式转换. JavaScript 中的显示转换 JS 中的显示转换主要指的就是手动转换为 数值.字符串.布尔值. 任意值转换为数值 基本数据类型值转换为数值 原始类型的值主要是字符串.布尔值.undefined和null,它们都能被Number转成数值或NaN. // 数值:…
数据类型转换: //number转换成str // var str=a+''; // console.log(str); // console.log(typeof str); //转换成字符串了 var str2=a.toString(); //强制转换成 string console.log(typeof str2); //str转换成 number var stringNum='789'; var num2=Number(stringNum); console.log(num2); con…
前些天在<浅谈 JSON.stringify 方法>说了他的正确使用姿势,今天来说下 toJSON 方法吧.其实我觉得这货跟 toString 一个道理,他是给 stringify 方法字符串化的时候调用的.看下 MDN 官方文档吧<toJSON behavior>.非常简单,但是要注意的是他和 stringify 方法第二个参数稍微有点不同.因为 stringify 第二个参数是回调函数时,只是对当前 key 对应的值进行修改.而 toJSON 则是对当前对象进行修改.例如: v…
一.数据类型的转换 数据类型的转换方法 强制转换(显示转换,主动转换) 字符转数值 parseInt(要转换的数值或变量) 转整数 从左向右依次转换,遇到第一个非数字的字符,停止转换 忽略小数点后的内容,其实是将小数点识别成了非数字,所以没有四舍五入 如果第一位就是非数字,直接 NaN NaN:not a number 不是一个数字的数值型数据,非法的数值运算结果 parseFloat(要转换的数值或变量) 转小数 从左向右依次转换,遇到第一个非数字的字符,停止转换 可以识别小数点 如果第一位就…
博客申请下来已经过去一个月了,一直不知道写点什么,毕竟我的文笔不是很好orz. 不过既然申请下来了,不写点什么总是觉得很可惜.正好最近在自己写框架,就把自己的进程和一些心得体会分享出来吧. 写在前面: 这一系列<从头开始写框架>文章,算是我的经验总结.因为以前读各位大牛的源代码时,总是会冒出这样的想法“如果他能把每一步都标注的很明确,那该多好,一定会省下我很多时间.”.但是大牛们愿意分享出源代码已经是很感谢了,怎么还能要求别人这么多呢~  所以在这系列文章里,会事无巨细的把所有细节都标注清楚.…
> 昨晚无意中看到类似下面结构的一段代码的取值问题,引起我的兴趣,花了点时间写了个demo给大家分享一下... var obj = [ {"2011":{"name":"jyjin","age":20}}, {"2012":{"name":"jyjin","age":21}} ]; var obj1 = { "2013":…