javascript之高级函数应用思想
1.级联函数:应用对象方法调用的连写
function A(){
this.a = '';
this.b = '';
this.c = '';
} //改造一下
A.prototype = { A.prototype = {
setA : function(){ setA : function(){
this.a = 'A'; this.a = 'A';
}, return this;
setB : function(){ },
this.b = 'B'; setB : function(){
}, this.b = 'B';
setC : function(){ return this;
this.c = 'c'; },
} setC : function(){
} this.c = 'c';
var x = new A(); return this;
x.setA(); }
x.setB(); }
x.setC(); x.setA().setB().setC();
2.惰性载入:性能优化
我们先看个案例
function addEvent(type, element, func){
if(element.addEventListener){
element.addEventListener(type, func, false);
}else if(element.attachEvent){
element.attachEvent('on'+type, func);
}else{
element['on'+type] = func;
}
}
每次调用addEvent函数的时候,它都要对浏览器事件机制进行检查,从第一个 if 开始判断,无端地浪费了内存,javasript提出了 惰性载入函数思想,第一次判断出浏览器能力,之后就不再判断了,好啦,脱衣解裤,我们开始吧......
方式一:函数重写方式
/**
* 分析:
* 在这个惰性载入的addEvent()中,if语句的每个分支都会为addEvent变量赋值,有效覆盖了原函数。
* 最后一步便是调用了新赋函数。下一次调用addEvent()的时候,
* 便会直接调用新赋值的函数,这样就不用再执行if语句了
*/
function addEvent(type, element, func){
if(element.addEventListener){
//惰性载入重写addEvent()
addEvent = function(type, element, func){
element.addEventListener(type, func, false);
};
}else if(element.attachEvent){
addEvent = function(type, element, func){
element.attachEvent('on'+type, func);
}; }else{
addEvent = function(type, element, func){
element['on'+type] = func;
};
}
return addEvent(type, element, func);
}
方式二: 匿名函数立即调用方式
/**
* 分析:
* 创建一个匿名的自执行函数,通过不同的分支以确定应该使用那个函数实现,
* 每个分支都返回一个正确的函数,并立即将其赋值给变量addEvent
* 之后每次调用都是这个被赋的值
*/
var addEvent = (function(){
if(document.addEventListener){
return function(type, element, func){
element.addEventListener(type, func, false);
};
}else if(document.attachEvent){
return function(type, element, func){
element.attachEvent('on'+type, func);
};
}else{
return function(type, element, func){
element['on'+type] = func;
};
}
})();
怎么样,是不是有点小高潮,反正我是湿了......
3.函数柯里化: 这里就不讲解了,感觉没JB用,
javascript之高级函数应用思想的更多相关文章
- javaScript的高级函数
1.map() map()方法返回一个新数组,新数组是原始数组调用函数之后处理后的值. map()方法按照原始数组元素顺序依次处理元素. map不会对空数组进行检测. map不会改变原始数组 . 参数 ...
- javascript高级函数
高级函数 安全的类型检测 js内置的类型检测并非完全可靠,typeof操作符难以判断某个值是否为函数 instanceof在多个frame的情况下,会出现问题. 例如:var isArray = va ...
- 22.1 高级函数【JavaScript高级程序设计第三版】
函数是JavaScript 中最有趣的部分之一.它们本质上是十分简单和过程化的,但也可以是非常复杂和动态的.一些额外的功能可以通过使用闭包来实现.此外,由于所有的函数都是对象,所以使用函数指针非常简单 ...
- 一篇文章把你带入到JavaScript中的闭包与高级函数
在JavaScript中,函数是一等公民.JavaScript是一门面向对象的编程语言,但是同时也有很多函数式编程的特性,如Lambda表达式,闭包,高阶函数等,函数式编程时一种编程范式. funct ...
- 前端常用的库和实用技术之JavaScript高级函数
1.惰性载入函数 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- 学习javaScript必知必会(3)~数组(数组创建,for...in遍历,辅助函数,高级函数filter、map、reduce)
一.数组: 1.js是弱语言,js中的数组定义时:不用指定数据类型.不用功指定数组长度:数组可以存储任何数据类型的数据 2.数组定义的[ ] 的实质: [] = new Array(); {} = n ...
- JavaScript高阶函数 map reduce filter sort
本文是笔者在看廖雪峰老师JavaScript教程时的个人总结 高阶函数 一个函数就接收另一个函数作为参数,这种函数就称之为高阶函数 1.高阶函数之map: ...
- JavaScript 立即执行函数
js中(function(){…})()立即执行函数写法理解 javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花,当然,能理解各型各色的写法 ...
- Javascript学习之函数(function)
在JS中,Function(函数)类型实际上是对象;每个函数都是Function类型的实例,而且都与其他引用类型一样具有属性和方法.由于函数是对象,因此函数名实际上也是一个指向函数对象的指针. 一 函 ...
随机推荐
- 使用phpExcel向mysql数据库导入excel
使用phpExcel向mysql数据库导入excel from:http://blog.163.com/dustye_l/blog/static/172439513201242491016834/ 使 ...
- Redis 字符串(String)
Redis 字符串数据类型的相关命令用于管理 redis 字符串值,基本语法如下: 语法 redis 127.0.0.1:6379> COMMAND KEY_NAME 实例 redis 12 ...
- Eclipse配置C/C++开发环境
开发环境:Eclipse3.2.CDT3.1.MinGW5.1 1.Eclipse及CDT的安装到Eclipse的官方网站http://www.eclipse.org上下载Eclipse.安装CDT. ...
- ipad mini2 ios7 磁盘分析文件夹大小
如果没越狱可以通过, 设置->通用->用量 来查看磁盘占用 越狱之后, 莫名其妙地 "其他" 占了两三个G.. windows下有个好用的工具folder size ...
- 在SSIS 的 64 位版本中不支持 Excel 连接管理器
Microsoft sql server 2008 R2——> SQL SERVER Business Intelligence Development Studio 使用EXCEL数据源或目标 ...
- sql 自定义函数--固定格式字符转时间类型
遇到一个德国的客户,他们的时间格式是JJJJ-TT-DD HH:MM:SS,程序按照这个格式将时间插入数据库,但是在sql自带的转换函数convert.cast过程中报错,网上搜了下都说用conver ...
- 解决Deprecated: mysql_connect(): The mysql extension is deprecated and will be removed in the future: use mysqli or PDO instead in
php 5个版本,5.2.5.3.5.4.5.5,怕跟不上时代,新的服务器直接上5.5,但是程序出现如下错误:Deprecated: mysql_connect(): The mysql extens ...
- javaweb学习总结十七(web应用组织结构、web.xml作用以及配置虚拟主机搭建网站)
一:web应用组织结构 1:web应用组成结构 2:安装web组成机构手动创建一个web应用程序目录 a:在webapps下创建目录web b:在web目录下创建html.jsp.css.js.WEB ...
- 知道网站PV流量,如何选何云主机配置带宽大小
- Angular 2.0 从0到1 (四)
第一节:Angular 2.0 从0到1 (一)第二节:Angular 2.0 从0到1 (二)第三节:Angular 2.0 从0到1 (三)第四节:Angular 2.0 从0到1 (四)第五节: ...