前言 javascript因为他的不完美,
导致了字符串可以有好几种转化为数字的方法,
但是可用的方法越多,留下的坑也就比较多.
parseInt 几乎所有浏览器都能解析处理此方法.
console.log(parseInt('001一介布衣');
//有些老旧浏览器会返回 0
//现代浏览器会返回 1
此方法优点:
** 处理速度最快**
Number Number 几乎所有浏览器都支持解析,
但是它针对参数是否有引号会做出不同的解析.
console.log(Number('0028'));
输出:28
console.log(Number(023));
输出:19
当 Numbe
javascript 查看更多
关于 ES6规范及新特性
对象字面量申明增强
ES6 之前,申明对象字面量方式其实就是直接定义一个json对象.存在的仅仅是对象的属性和值.
ES6 之后,对象字面量被扩展支持直接设置原型，
简洁属性赋值和方法，
超类调用,
这也让对象字面量和类声明的关系更密切，并让基于对象的设计更便利
ES6之前:
var obj = {
__proto__: theProtoObj,
// 下面的写法不会设置内部原型
'__proto__': theProtoObj,
// 方法
toString() {
// 调用父对象的方法
return "d "
javascript 查看更多
ES6是对 javascript 语言的一次重大更新，是自从2009年ES5标准化后的第一次重大更新
主要的JavaScript引擎正在逐步实现这些特性，点击这里查看浏览器的兼容情况
这次更新涉及到的新特性还比较多,我们分几个部分来简单介绍 ES6 中模块导入
类似下面的语法:
import fs from 'fs';
import path from 'path';
这里的 import是在编译时决定的( 即在脚本开始执行之前 )
事实上，各个模块之间的依赖关系图所涉及的所有imports和exports都是在执行之前已经决定
如果我们的代码中需要按需加载的需求，即在运行时才进行模
javascript 查看更多
#为什么用webpack
如果我们 前端 javascript 能像 node.js 一样 require 去引用一个依赖包,那么前端的世界就不会像现在这么乱
现在为什么乱?
假设:
a.js 依赖 b.js
b.js 依赖 c.js
c.js 依赖 d.js
如果在我们前端去引用这些依赖的时候,往往是这样的:
<script src='a.js'></script>
<script src='b.js'></script>
<script src='c.js'></script>
<scri
javascript 查看更多
概述
CommonJS是服务器端模块的规范，Node.js采用了这个规范。
根据CommonJS规范，一个单独的文件就是一个模块。
加载模块使用require方法，该方法读取一个文件并执行，最后返回文件内部的exports对象。下面就是一个简单的模块文件example.js。
console.log("evaluating example.js");
var invisible = function () {
console.log("invisible");
}
exports.message = "hi";
exports.say = function () {
c
javascript 查看更多
javascript 在浏览器中的加载是如何的?
如何你的 script 上没有任何 异步,阻塞 等标注:
浏览器会异步加载 javascript 文件,但是会按照引用文件中的书写顺序从上到下执行解析 javascript
Defer属性标记
defer是html4.0中定义的，该属性使得浏览器能延迟脚本的执行，等文档完成解析完成后会按照他们在文档出现顺序再去下载解析。
也就是说defer属性的 script 就类似于将 script 放在body中的加载 效果一致.
但是defer属性在各个浏览器中支持程度有点不同,就是说,有的浏览器不完全支持.
Async属性标注
as
javascript 查看更多
上一篇博文介绍了 html5 file api
html5 提供了一套可以操作本地文件的 api ,但是有一定的局限性
必须由用户发起一个事件,所以你不要妄想着用户浏览器加载某个站点时,主动去读取他本地硬盘的资料....不可能的.
你的浏览器必须支持 html5 的 file api ,所以你也不要妄想去兼容IE6
用户发起行为比如: file upload 操作, 文件拖拽 等.
最近遇到一个需求
1.本地上传视频要保存到七牛服务器
2.提交切割视频任务 (大文件切割成多份)
3.返回视频截图 (按视频长短截取图片,供管理员审核视频内容)
七牛这边提供的有 j
html5 查看更多
UglifyJS2 这个工具使用很长时间了,但之前都是在 gulp 自动构建 时用到了 UglifyJS 算法进行压缩.
最近玩了一下 UglifyJS2 ,做了一个 在线压缩javascript工具 欢迎点击玩耍.
为什么要压缩 javascript 因为每个人开发者的书写习惯,定义参数习惯,已经使用习惯都不一样.
所以相同的功能出自不同开发者代码各异.这里牵扯到一个代码所占空间.
以前端为例来说明
大家通常都会认为,现在在网络时代,动不动就是10M光纤,拨号上网让人感觉是上个世纪的方式.....
说法是没有问题,但是,我们今天讨论的并不是终端下载速度.
而是前端压缩对服务器有何利
nodejs 查看更多
前几天和大家分享了一篇 javascript生成二维码,实现微信跳转
里面提到了一个二维码的容错率,知道今天发现了一个bug ,又重新找了找关于javascript 生成二维码的资料.回头我会整理一下,提供微信端跳出内置浏览器的最佳方案
什么是容错率
顾名思义,就是容许犯错的概率
二维码的容错率
是指生成的二维码允许犯错吗? 不是!
二维码的容错率,是指你生成的二维码就算被遮挡了一部分,或者有一部分没有完全显示出来,当时用户通过各种各样品牌的手机都能扫描成功,这个被遮挡部分在全部的比值,就相当于一个容错率
所以二维码的容错率,跟贴切的叫法是,二维码的冗余度有多大.
什么是冗余度
开发工具 查看更多
javascript 中对于时间类型的处理 如何把日期字符串如“2015-09-19 09:48:46”转换为Date对象
第一种方法: 我们可以按下面的方法来拆分上面的时间字符串
var str="2015-09-19 09:48:46";
var strArray=str.split(" ");
var strDate=strArray[0].split("-");
var strTime=strArray[1].split(":");
var time=new Date(strDate[0],(strDate[1]-parseInt(1)),strDate[2],strTime[0]
javascript 查看更多
上一篇博客中和大家分享了关于 字符串转时间类型
这一篇顺便整理下 javascript 中 Date 类型的一些方法
var time = new Date();
var year=time.getYear(); //获取当前年份(2位)
var year1=time.getFullYear(); //获取完整的年份(4位,2015-????)
var moonth=time.getMonth(); //获取当前月份(0-11,0代表1月)
time.getDate(); //获取当前日(
javascript 查看更多
javascript 中 new Array() 和 var arr=[ ] 创建数组到底有何不同?
今天就探讨一个 JavaScript 中很常见的问题.
var arr=[]
这是一种字面量定义数组的方法
var arr=new Array()
这是调用数组构造函数生成的数组
上面的2种定义数组的方法到底一样不一样
目前我们大致的认同是下面这样的
用new 关键字去内存开辟一个存储地址比较耗资源,耗内存. 而字面量方式直接在内存开辟一个存储字段相对简单,不耗资源.
我们首先不去否定上面的结论对不对.
首先从功能上来说 var =arr=[] 和 var arr= new
javascript 查看更多
现在的二维码相当火,借着移动互联网的风口也快飞起来了.现在各种语言的各种开源包,基本都有对应的生成二维码的源码.但是今天我们分享的不是服务器生成二维码,而是前端页面如果用 javascript 来生成一个二维码.这种动态生成二维码的需求越来越多.如果都要依靠服务器端赖生成,第一:面临资源紧缺的状况,如果在大的并发环境,这种cpu密集型计算必定导致一个问题,就是请求排队,那就不用谈了.用户不会一直在傻傻的等你.第二:就算你顺利生成了二维码,还面临一个网络传输带宽的压力,虽然它很小很小,但是当在一个并发压力大的环境下,依然面临带宽被占的问题.这样说来,如果能在客户端生成二维码,貌似是最好的解决方案
javascript 查看更多
接着上一篇的ECMAScript 6 数组扩展方法数组元素迭代方法还剩下 filter , some , every3. filter过滤数组,将数组元素迭代,依次调用回调函数array.filter(callback);实例:我们遍历迭代a数组,然后每个元素对2整除,符合条件的返回.vara=[1,2,3];
varb=a.filter(function(item,index,a){
returnitem%2==0;
});
console.log(b);filter 第一个参数是回调函数function(item,index,a)item 是当前迭代元素index 当前迭代元素所在索引a
javascript 查看更多
Promise是commonjs规范中的内容.现已经纳入了ES6，并且高版本的chrome、firefox浏览器都已经原生实现了Promise，只不过和现如今流行的类Promise类库相比少些API.这里说的是指Promise/A+ 规范.Promose 主要用于异步调用规范,它有三种状态， 等待（pending）、已完成（fulfilled）、已拒绝（rejected）等待 --> 已完成 / 等待 --> 已拒绝 但是已完成和已拒绝状态不可能互相转化.为什么要出现 Promose 规范:一直以来,对于javascript的异步回调,我们祖祖辈辈都是用callback方式 (貌似
javascript 查看更多
此篇博文其实是上一篇的一个小细节,单独拿出来说一下,否则上一篇叉开的分支太多,太乱.因为上一篇和大家分享了node.js 中使用util.inherits实现继承 我们单独给出一个小demo ,_base.js 父类继承了 events.EventEmitter 类.varevents=require('events');
varutil=require('util');
function_base(){
this.emitter=newevents.EventEmitter(this);
};
util.inherits(_base,events.Even
javascript 查看更多
前天写了一篇关于匿名函数的原型链和集成的文章(点击链接查看),里面蜻蜓点水式的把实例,原型对象和构造函数带过去了.这种抽象的东西不是很好记忆,我们通过一个示例来说明可能更好了解.functionPerson(name){
this.name=name;
}在javascript中,你可以把上面的代码看做一个函数,一个类,一个方法,都没有问题.但是你又能看到其他静态语言的一些身影, 比如: this.name=name; 这是标准的初始化内部属性/变量的语句,第一反应这应该是构造函数.其实,在javascript中,任何一个函数你都可以把它看做是构造函数,它没有明显的特征.那什么时候它就明显了呢
javascript 查看更多
上一篇博客已经说了关于javascript中的封装,其中也说了javascript中本来是没有类的,我们上一篇的封装也是用javascript中的函数去模拟一个类,最后我们还模拟了一个构造函数.那么今天和大家分享的关于继承,同样不是真正严格意义上面向对象的继承,而是通过javascript中的原型链关系实现函数之间的属性,方法共享.下面简单分享几种封装的方法.既然说到继承,我们必须有一个基类functionPerson(){
this.eat=function(){
return'吃食物';
}
}
Person.prototype.sport=function(){
javascript 查看更多
javascript 是一门很灵活的语言,也是一门有缺陷的语言.比如我们今天要谈的,如何用面向对象的手法来封装javascript ,javascript是没有类的概念的.所以今天谈到的封装,其实就是用javascript的函数来实现的.varPeople{
name:’一介布衣’,
age:’30'
};这就是javascript中的一个对象,里面封装了2个属性.实例化一个对象的实例 peoplevarpeople=newPeople();
console.log(people.name,people.age);//一介布衣,30如果我们需要在函数里返回一个对象,如下代码:funct
javascript 查看更多
要搞清楚闭包,首先要知道javascript中的作用域.什么是作用域,你可以简单的理解成当前上下文环境.javascript 中的作用域有2种属于全局作用域.属于局部作用域全局作用域:比如我们在浏览器端编写的 javascript 代码,varname=‘test’;我们直接定义了一个变量name ,那么这个变量当前作用域就是全局,对于浏览器端全局就是window更确切的说,name 是window 对象的一个属性.console.log(window.name);//test
console.log(name);//test
console.log(this.name);//test上面三种
javascript 查看更多
javascript经过浏览器大战的几次更新换代,终于一统江湖,稳坐第一把交椅,经过你会发现javascript语法和实现并不尽人意,但是丝毫不影响它的发展.我们最开始接触javascript应该大部分是从html中的js脚本开始,但是这种看似简单的语言稀里糊涂的用了好几年,也没有搞清楚它的一些原理机制,有没有躺枪!起码javascript在操作dom的时候用了各种事件回调,比如按钮,链接的点击,鼠标经过,获取焦点等等.在这个过程中,我们在dom上绑定一个事件回调函数 比如 onclick="doCheck()" 这个过程就是给dom元素注册了一个click 事件,并且绑定
javascript 查看更多
Github 托管这各式各样的开源项目,编程语言多种多样,当长久以来Ruby语言开发的项目居首.原因是因为Github 本身就是由Ruby 社区诞生出来的,所以长久以来它是Ruby的大本营.逐渐其他语言开发的开源项目也托管过来,久而久之语言种类越来越多,但是从未撼动过Ruby 的地位.但是到目前为止,javascript已经在github上稳坐第一把交椅,我个人认为是这几点因素:(1)如今前端javascript以垄断形式抢占web浏览器,可见前端javascript 工程师一抓一大把.(2)2009年发布至今的node.js 运行在服务器后端环境的javascript,以前得天独厚的web开
javascript 查看更多
在前几篇博客中谈到了用javascript中利用函数的函数模拟类,既然有类,那就应该存在面向对象的三大基本属性,或者说可以模拟出面向对象的三大基本属性.今天我们要学习的就是面向对象的继承 – javascript原型继承.为什么叫原型继承,因为我们知道javascript本没有类,它完全是基于原型对象的一门弱类型语言.所以javascript依靠原生对象创建出来的新对象就继承了原生对象的一些属性和方法.上面模拟了一个person类,person构造函数里初始化了姓名,然后我们创建一个学生的对象,并起名为 ‘小小’ 最后程序运行结果显示 小小.其实student 对象并没有定义姓名属性,为什么会
javascript 查看更多
上一博文说到了 javascript 中的原型继承,还说到了和大家分享 call , apply 实现继承,所以,就有了这篇博文.我们还是定义一个person 类 和一个 student 类,如下上面的student 类的构造函数传入了3个参数,当我们用call 实现 student 继承 person 的时候时,person的构造函数只实现了2个参数的传入,所以第三个参数必须要student自己来实现.及学生有了成绩的这个属性.student 类还重新定义eat 方法,到底之类重写父类的方法时,父类的同名方法会不会被覆盖? call 能不能实现 student 继承 person ? 这些疑
javascript 查看更多
常见的时间类型字符串:vardate1="2014-03-0912:00:00";javascript 对 类似上面这种时间转化不感冒,它更青睐的是这种字符串格式的时间 "2014/03/09 12:00:00" ,我们姑且称作date2所以有种非常简单的方法就是将 date1 的格式转换成 date2 的格式然后再转化时间类型.如下vartime1=newDate(Date.parse(date1.replace(/-/g,"/")));上面一行代码实现了date1 转 时间类型.求时间差方法:var days=time1-time
javascript 查看更多
嗯,没错,今天就是要讲下javascript中的类,哈哈,希望不要对大家有所误解!稍微对javascript有所了解的人应该知道,javascript这门弱类型语言没有类的概念,它是基于对象的.看了上面这句不仅有人低估起来了,既然有对象,为啥能没有类呢? 的确,javascript 是一门很怪异的弱类型语言,它的怪异之处以后慢慢讲,而它基于的对象并不是从类实例化过来的对象,而是原型对象.原型对象从哪来? 用一个不确切的比喻来说好比造物主创造世界的时候初始化了一些原生的东西,比如男人,女人,这是俩个活生生的原型而不是类型,也就是说javascript本身就内置了几种对象,而以后创建的对象都是从这
javascript 查看更多
简单说下关于javascript中的对象.javascript 不是一门面向对象的语言,而是一门基于对象的语言,它的所有类型都基于Object原型而存在.但是我们常说 javascript中包括值类型 ,比如 boolean ,number, string 等值类型,其实这些值类型被称为 伪对象,他们对应javascript中三个内置对象分别是:Boolean , Number , String 而解析器将这三个对象的方法和属性同样绑定在对应字面量值类型上(boolean,number,string) 所以javascript中值类型也是也拥有了方法和属性,一般推荐直接使用这3个内置对象的字面
javascript 查看更多
如你所想,确实有点标题党手里有本鸟哥的<<linux私房菜>>对于一个linux菜鸟来说受益很大,所以我也来道私房菜,对鸟哥致敬!!eval 很神秘,你不觉得吗? 你可能常常会用到这个函数,但是有不太明天它到底是干什么的,其实我之前也一样非常糊涂,所以写了这篇博和大家一起学习探讨.很早一段时间我认为 eval 是个格式化函数,为什么这样认为,起因是ajax接收后台传过来的json格式字符串,javascript直接接收后台传入的json格式总是不识别,只要用神奇的 eval 函数转化一下就ok了,下面我们一起来认识一下 evalevalw3c 给出的定义是: eval(
javascript 查看更多
javascript 环境里的时间戳随处可见,这个值表示的是从 1970年1月1日午夜0点开始计数到现在的一个毫秒数.获取JavaScript中的时间戳有几种方法:vartimestamp=Date.parse(newDate());此方法精确到了秒,毫秒位数上全部都是0vartimestamp=(newDate()).valueOf();此方法精确到了毫秒位.如果考虑到浏览器兼容性的问题,上面的方法可以兼容市面上大多的浏览器,推荐使用.vartimestamp=newDate().getTime();此方法和上面得到的值一样.vartimestamp=Date.now();如果是在V8环境下
javascript 查看更多
DatecurDate=newDate();
varpreDate=newDate(curDate.getTime()–24*60*60*1000);//前一天
varnextDate=newDate(curDate.getTime()+24*60*60*1000);//后一天
javascript 查看更多