首页 web前端 js教程 让JavaScript拥有类似Lambda表达式编程能力的方法_javascript技巧

让JavaScript拥有类似Lambda表达式编程能力的方法_javascript技巧

May 16, 2016 pm 06:19 PM
lambda 编程能力 表达式

但是我后来也跟人说,因为接受的参数太多,所以如果不把智能提示写得很清楚的话,连我自己都常常搞不清楚该怎么用。

不过,接受参数多,除了容易弄错用法以外,还会产生另一个问题,这也是我编写出今天发布的这个东西的原因。
来看一下JS版的页码呈现组件的完全版函数签名:

复制代码 代码如下:

function pnView(
currentPage, actionCurrent,
beginPage, endPage,
actionBegin, actionEnd,
currentSiblings, actionCurrentSibling,
preventFolding, actionFolding,
endOfBegin, beginOfEnd,
actionBeginSibling, actionEndSibling
)

可以看到,这个可以最大幅度进行自定义的完全版函数签名,接受14个参数,而其中有一半——也就是7个参数,是要接受回调函数的。
由此产生的问题就是需要手工写入多次的“function(){}”等字符组合,就像这样:
复制代码 代码如下:

function ww(s) { document.write(s); }
function ws(n) { ww(' (' + n + ') '); }
pnView(14, function (n) { ww(' [' + n + '] ') },
1, 27,
function (n) { ww('| '); }, function (n) { ww(' ' + n + ' >|'); },
2, ws,
1, function () { ww(' ... '); },
2, 2,
ws, ws
);

当我在网页中测试这个组件的时候我就觉得自己非常想念C#中的Lambda表达式——虽然有些人、有些JS框架会把匿名函数称作“Lambda表达式”,但其实那只相当于C#中的“匿名委托/函数”,而Lambda的(表面)特征是使用简短的语法模式来反映一个(回调)函数/过程(或者说动作)的逻辑,而不被“delegate”或者别的什么关键字分散精力。

出于这样的原因,我编写了这个可以转译JS代码、把一种特定的模式(pattern)翻译成函数定义的模块。
在使用这个模块以后,前面的那个调用可以变成这个样子:
复制代码 代码如下:

eval(function () {
var ww = (s, document.write(s));
var ws = (n, ww(' (' + n + ') '));
pnView(14, (n, ww(' [' + n + '] ')),
1, 27,
(n, ww('| ')), (n, ww(' ' + n + ' >|')),
2, ws,
1, (0, ww(' ... ')),
2, 2,
ws, ws
);
}.lamda())();

模块的完整代码如下:
复制代码 代码如下:

/*!
L-amda "a-Lambda", a module provides Alternate "Lambda" style programming ability for JavaScript.
Created By NanaLich. 2010-09-08
This module is published under WTFPL v2, so you just DO WHAT THE Fxxx YOU WANT TO with it.
*/
!function () {
function attachEntry(o, a, m) {
var i, j, n;
o = [].concat(o);
//if (!(o instanceof Array)) o = [o];
while (i = o.shift()) {
for (j in a) {
if (!i[n = a[j]]) i[n] = m;
}
}
}
var rx0 = /^\s*(0|NaN|null)\s*,$/;
var rx1 = /([\W]\s*)\((\s*0\s*,|(?:\s*[a-z_$][\w$]*\s*,)+)|"(\\[\s\S]|[^\x22])*"|'(\\[\s\S]|[^\x27])*'/gi;
var rx2 = /\)/g;
function rxGetFlags(rx) { // 取出正则表达式的创建选项
return (rx.global ? 'g' : '') + (rx.ignoreCase ? 'i' : '') + (rx.multiline ? 'm' : '');
//return /\/([gim]*)$/.exec('' + rx)[1];
}
attachEntry(RegExp, ['getFlags'], rxGetFlags);
attachEntry(RegExp.prototype, ['getFlags'], function () {
return rxGetFlags(this);
});

function translateLambda(s) {
if (typeof (s) != 'string') s = '' + s;
var x = new RegExp(rx1.source, rx1.getFlags());
var y = new RegExp(rx2.source, rx2.getFlags()); // 由于firefox、safari等浏览器对全局匹配正则表达式有过度的优化,所以这里采用一种迂回的办法创建不重复的正则表达式实例
var m, l = 0, r = '';
while (m = x.exec(s)) {
var c = m[0], h, p, q, t;
switch (c.charAt(0)) { // 判断期待的语法成分
case '$':
case ')':
case ']':
case '"':
case "'":
continue; // 函数传参,跳过
}

h = m[2];
if (rx0.test(h))
h = '';
else
h = h.substr(0, h.length - 1); // 去掉末尾的逗号
r += s.substring(l, p = m.index); // 在结果字符串上附加之前余留的内容
y.lastIndex = l = p + c.length; // 从逗号之后开始寻找右括号
while (q = y.exec(s)) {
q = q.index;
try {
t = 'return ' + s.substring(l, q) + ';';
new Function(t); // 语法测试
//r += c + 'function(' + h + '){ ' + translateLambda(t) + ' }'; // 翻译里面的内容
r += m[1] + 'function(' + h + '){ ' + translateLambda(t) + ' }'; // 翻译里面的内容
x.lastIndex = l = q + 1; // 下一次查找从括号之后开始
break;
} catch (ex) { }
}
if (!q) l = p; // 说明找不到右括号或者有效的代码,直接附加所有匹配的内容
}
try {
r += s.substr(l);
if (/[\w$]*|"(\\[\s\S]|[^\x22])*"|'(\\[\s\S]|[^\x27])*'/.exec(r)[0] == 'function') // 粗略判断产生的是不是函数(可以应付绝大部分情况)
r = '0,' + r; // 使用这种“怪”形式可以在所有浏览器(包括IE)中得到预期的效果
new Function(r); // 语法测试
return r;
} catch (ex) { // 失败,返回原文
return s;
}
};

var lamdaAliases = ["translateLambda", "lambda", "lamda"];
attachEntry([Function, String], lamdaAliases, translateLambda);
attachEntry([Function.prototype, String.prototype], lamdaAliases, function () {
return translateLambda(this);
});
} ();

如果和C#中的Lambda表达式相比的话,我的这个模块还是有很多不足的,不过现在这个样子已经让我很满意了,至少我不用再写太多的“function”了。
简单来说,这个模块的规格特性是这样的——
优点:
减少编写代码时“function”的出现次数;
使用可以在一般的JavaScript编辑器中正常编辑的语法模式(pattern),直接写在函数体中不会导致语法错误。
局限性:
在任何时候使用这个模块都必须调用转译方法(“translateLambda”、“lambda”或者“lamda”)和eval函数,无法省略;
如果存在一个函数A,不可能通过对A进行处理来达到转译传递至A的参数的目的(也就是说a.lambda()或者类似的操作并不会让a((x, x * 2))等同于a(function(x){ return x * 2; }));
不能包含表达式之外的任何语句、不能包含使用“;”来分隔的多条语句。
缺点:
连续出现的括号可能会让代码变得难以理解;
任何编辑器都无法为Lambda表达式提供语法高亮;
存在错误地转译现有代码的可能性——这个模块选择进行匹配的模式是在正常的代码中没有实用价值、也通常不会出现的模式,如:(x, x * 2)等价于单纯的x * 2、(0, a.method())等价于单纯的a.method(),所以这个缺点影响到实际代码的可能性无限趋近于0。
以下是几种不当的用法:
1、使用这个模块并不会节省很多代码量的时候:本末倒置。
复制代码 代码如下:

eval(function(){ // 不仅没减少代码量,反而还增加了
window.onload = (0, alert('载入完成!'));
}.lambda());

2、对接受参数的函数进行转译处理:之前已经提到过这种情况。
复制代码 代码如下:

eval(somefunction.lambda())((x, x.toString(16))); // somefunction可能会产生预料外的结果,而且收到的参数会是x.toString(16)的结果(如果x在此处并没有被定义过,还会产生一个“变量不存在”的异常),而非一个回调函数。

3、为了使用此模块而规避语法检查:
因为使用的是在JavaScript中有效但无实用价值的语法,所以规避语法检查是完全没有必要的。
复制代码 代码如下:

eval("somefunction((x, x.toString(16)))".lamda()); // 失去了语法检查,可能在运行的时候产生意外

4、在(伪)Lambda中使用过多的操作,甚至多条语句:
在设计这个模块的时候我并没有找出可以使用多条语句且可以通过语法检查的模式(pattern),原因是在Lambda表达式中使用多条语句时,“function”、“return”等几个字符所增加的代码量通常是可以忽略的,这样去使用Lambda表达式本身就属于一种偏离了初衷的做法。
复制代码 代码如下:

eval(function(){ somefunction((x, y.something(x); return x.toString(16))); }.lamda())(); // 语法错误
eval(function(){ somefunction((x, y.something(x), x.toString(16))); }.lamda())(); // 容易产生理解上的歧义
eval(function(){ somefunction((x, ++x)); }.lamda())(); // 简单的表达式可以被接受

最佳使用场合:
现在很多人写JavaScript的时候喜欢把自己的代码都写在一个闭包里面,这样可以避免全局作用域污染问题,就像这样:
复制代码 代码如下:

(function(){
// 所有的代码都放在这里
})();

——而这种“大”闭包正好是使用本模块的最佳场合:
复制代码 代码如下:

eval(function(){ // 括号前增加eval
// 所有的代码都放在这里
}.lamda())(); // 括号里增加.lamda()

昨天codeplex抽疯,代码和release上传总出错。再考虑到这个模块的使用场合比较有限,不适合缺乏JavaScript经验的人使用,所以不另外提供源代码打包下载——有需要的话请直接从文中复制。
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

lambda 表达式在 C++ 中如何处理异常? lambda 表达式在 C++ 中如何处理异常? Apr 17, 2024 pm 12:42 PM

在C++中,使用Lambda表达式处理异常有两种方法:使用try-catch块捕获异常,并在catch块中处理或重新抛出异常。使用std::function类型的包装函数,其try_emplace方法可以捕获Lambda表达式中的异常。

C++ lambda 表达式中闭包的含义是什么? C++ lambda 表达式中闭包的含义是什么? Apr 17, 2024 pm 06:15 PM

在C++中,闭包是能够访问外部变量的lambda表达式。要创建闭包,请捕获lambda表达式中的外部变量。闭包提供可复用性、信息隐藏和延迟求值等优势。它们在事件处理程序等实际情况中很有用,其中即使外部变量被销毁,闭包仍然可以访问它们。

用 C++ lambda 表达式实现多线程编程的优势是什么? 用 C++ lambda 表达式实现多线程编程的优势是什么? Apr 17, 2024 pm 05:24 PM

lambda表达式在C++多线程编程中的优势包括:简洁性、灵活性、易于传参和并行性。实战案例:使用lambda表达式创建多线程​​,在不同线程中打印线程ID,展示了该方法的简洁和易用性。

C++ Lambda 表达式如何实现闭包? C++ Lambda 表达式如何实现闭包? Jun 01, 2024 pm 05:50 PM

C++Lambda表达式支持闭包,即保存函数作用域变量并供函数访问。语法为[capture-list](parameters)->return-type{function-body}。capture-list定义要捕获的变量,可以使用[=]按值捕获所有局部变量,[&]按引用捕获所有局部变量,或[variable1,variable2,...]捕获特定变量。Lambda表达式只能访问捕获的变量,但无法修改原始值。

C++ lambda 表达式如何捕获外部变量? C++ lambda 表达式如何捕获外部变量? Apr 17, 2024 pm 04:39 PM

在C++中捕获外部变量的lambda表达式有三种方法:按值捕获:创建一个变量副本。按引用捕获:获得变量引用。同时按值和引用捕获:允许捕获多个变量,按值或按引用。

C++ 函数调用 Lambda 表达式:参数传递和返回值的回调优化 C++ 函数调用 Lambda 表达式:参数传递和返回值的回调优化 May 03, 2024 pm 12:12 PM

在C++中,可以使用Lambda表达式作为函数参数,实现回调函数的灵活性。具体而言:参数传递:通过std::function包装Lambda表达式,以函数指针形式传递给函数。返回值处理:使用std::function声明回调函数指针时指定返回值类型。实战案例:优化GUI事件处理中的回调,避免创建不必要的对象或函数指针,提高代码简洁性和可维护性。

如何使用 C++ lambda 表达式执行延迟求值? 如何使用 C++ lambda 表达式执行延迟求值? Apr 17, 2024 pm 12:36 PM

如何使用C++lambda表达式执行延迟求值?使用lambda表达式创建延迟求值的函数对象。延迟计算推迟到需要时才执行。仅当需要时才计算结果,提高性能。

C++ lambda 表达式的性能优化有哪些技巧? C++ lambda 表达式的性能优化有哪些技巧? Apr 17, 2024 pm 05:45 PM

优化C++Lambda表达式的性能技巧包括:避免创建不必要的lambda对象通过std::bind显式捕获最小的对象使用std::move移动捕获的变量以避免复制优化lambda体,避免不必要的内存分配、重复计算和全局变量访问

See all articles