`
yunhaifeiwu
  • 浏览: 163043 次
  • 性别: Icon_minigender_1
  • 来自: 宁波
社区版块
存档分类
最新评论

javascript函数式编程---解决事件参数传递问题

阅读更多
说明:函数式编程的概念,是本人的理解之物,不属于正规的严密定义。

备用知识点:

引用
函数式编程------由于函数最终是一个值,因此函数可像普通变量一样参于各种运算,这就是函数式编程。
Js支持函数式编程。

Js的函数调用,可用两个括号括起来,第一个表示定义的函数,第二个表示参数。
例:
alert(“aaa”); 
(alert)(“aaa”)
(function(v){ return alert(v);})("aaa");
;
上面三个等效。第三个,这部份----“(function(v){ return alert(v);})”新定义了一个
函数;而这部份----“("aaa")”向新定义的函数传递参数;也就是说第三个,函数定义与
调用写在了一起。




序:js----指javascript
=======================================

        在用js写UI组件,即对诸如div之类的封装时,不可避免的遇到一个困难。

当要在js所定义的对象中,为一个DOM节点的事件指定一个事件响应函数时,通

常这个事件响应函数的this对象是产生该事件的DOM节点,而得不到该函数所在

的对象。 另外,由于需要,通常还要为该事件响应函数传递其他参数。

         此时的解决之道就是应用函数式编程。下面是具体的应用实例。

=======================================






例:下面的例子将由js,定义了一个Button对象,该对象生成一个按钮。
点击该按钮时,事件方法中既得到事件方法调用时的Button对象,又不丢产生事件的对象(例中是dom树中的button节点)。
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
 

<script language=Javascript>
function Button(value) {
  this.value = value;
  this.button = document.createElement("button");
  this.button.appendChild(document.createTextNode("test"));
   
    document.body.appendChild(this.button);
    
    //注:这里才是点击事件的最终响应函数。
    this.falert=function(classObj,e){
       alert(classObj.value);
    }


    //下面onclick事件的右边第一个括符现定义了一个函数,这个函数的v参数,
    //保存了onclick调用时的this对象,即Button对象;
    // onclick事件的右边第二个括号传了onclick调用时的this对象即Button对象。

    this.button.onclick = (function(v) {
     return function() { 
            //调用Button对象的falert方法
           v.falert(v,this);//这里的this是事件源对象,即dom树中的button节点
	};
  }) (this);
}
 
var bt = new Button("affffffffddda");

</script>

</body>
</html>

其中:
1 falert为点击事件的响应函数,该函数的classObj是调用onclick事件函数时的this对象,这里即是用户自已定义的Button对象。e为产生onclick事件的对象,这时即为
Button类中创建的button节点。
    2 由此可看出,函数式编程,在不丢失事件源对象的前提下,成功地传递各种参数。

分享到:
评论

相关推荐

    javascript函数式编程

    JavaScript函数式编程是利用JavaScript语言编写函数式风格代码的一种编程范式。函数式编程强调使用纯函数、避免副作用、函数的不可变性以及利用高阶函数等概念。通过阅读《JavaScript函数式编程指南》,读者可以了解...

    JavaScript函数式编程.pdf

    不过,由于【标题】中提供了文档的名称——"JavaScript函数式编程.pdf",我可以根据这个名称扩展出关于JavaScript函数式编程的知识点。 JavaScript函数式编程的知识点非常丰富,涉及很多方面的内容,下面将详细介绍...

    JS函数式编程-Functional JavaScript

    标题《JS函数式编程-Functional JavaScript》涉及的知识点涵盖了JavaScript函数式编程的基本概念、重要性以及实际应用。在这一领域中,函数被当作一等公民,即它们可以被当作值一样传递和使用。函数式编程(FP)是一...

    JavaScript函数式编程pdf

    JavaScript函数式编程是一种编程范式,它将计算视为数据处理,并强调使用无副作用的纯函数。在JavaScript中,函数式编程允许我们写出更简洁、可读性更强的代码,同时提高了代码的复用性和测试性。《JavaScript函数式...

    javascript 函数式编程

    总之,JavaScript的函数式编程提供了一种不同的思考和解决问题的方式,它鼓励编写模块化、无副作用的代码,从而提高代码质量。通过学习和实践函数式编程,开发者可以更好地驾驭JavaScript,写出更高效、更易于理解和...

    JS 函数式编程指南 PDF

    函数式编程是一种编程范式,它强调使用函数来表达计算逻辑,其中函数被视为一等公民,意味着函数可以作为参数传递、作为结果返回以及赋值给变量。它与命令式编程相对,后者通过改变程序状态来控制计算流程。函数式...

    面向函数式编程-讲解

    总的来说,函数式编程提供了一种不同的思考问题和解决问题的方式,它在很多方面都有其独特的优点,但也需要开发者根据项目需求和团队背景权衡其适用性。理解并掌握函数式编程,可以帮助我们编写出更加可靠和高效的...

    javaScript函数式编程

    本书专门介绍JavaScript函数式编程的特性。 全书共9章,分别介绍了JavaScript函数式编程、一等函数与Applicative编程、变量的作用域和闭包、高阶函数、由函数构建函数、递归、纯度和不变性以及更改政策、基于流的...

    JavaScript ES6函数式编程入门经典_javascript_

    JavaScript ES6函数式编程是现代Web开发中的重要概念,它为开发者提供了更高效、更简洁的编程方式。本文将深入探讨ES6中的函数式编程特性,帮助初学者掌握这一核心技能。 1. **箭头函数**:箭头函数是ES6引入的一种...

    一本关于JavaScript中函数式编程的书

    JavaScript中的函数式编程是一种强大的编程范式,它源自数学中的函数理论,强调将计算视为函数的求值,而不是状态的变化或指令的...学习和实践函数式编程,对于提升JavaScript开发者的技能和解决问题的能力至关重要。

    函数式编程中文版.pdf

    在函数式编程中,函数是第一类公民,意味着函数可以被当做参数传递给其他函数、作为其他函数的返回值以及赋值给变量。这种编程范式强调的是无副作用、不变性和引用透明性。 纯函数是指没有副作用,不会引起外部状态...

    用函数式编程技术编写优美的 JavaScript

    - **匿名函数**:在函数式编程中,经常使用匿名函数作为参数传递给其他函数,或者直接在表达式中定义并立即执行。这种方法允许开发者快速定义函数逻辑而无需为其命名,提高了代码的灵活性。 - **高阶函数**:指的是...

    JavaScript ES6函数式编程入门经典_javascript_tall7cj_

    JavaScript ES6函数式编程入门经典是一本针对JavaScript开发者,尤其是初学者的教程,旨在帮助他们掌握ES6(ECMAScript 2015)的新特性,并深入理解函数式编程的概念和实践。函数式编程是一种编程范式,它强调将计算...

    JavaScript函数式编程

    JavaScript函数式编程是一种编程范式,它将计算视为数据处理,并强调使用无副作用的纯函数。在JavaScript中,函数式编程允许我们写出更简洁、可读性更强的代码,同时提高了代码的复用性和测试性。本电子教程将深入...

    javascript-978-1-8392-1306-9:掌握 JavaScript 函数式编程 - 第二版

    《掌握JavaScript函数式编程 - 第二版》是深入学习JavaScript编程技术的重要参考资料,尤其强调了函数式编程这一核心概念。JavaScript作为一门广泛应用于Web开发的动态类型语言,其灵活性和强大的功能很大程度上得益...

    JavaScript函数式编程1

    JavaScript函数式编程是一种编程范式,它强调使用函数作为基本的构建块,将计算视为纯数学函数的应用,而不是改变状态或执行控制流程。在JavaScript中,由于其动态类型和第一类函数特性,使得函数式编程成为可能。...

    JavaScript的函数式编程基础指南

    函数式编程在JavaScript中的核心在于将函数视为一等公民,即函数可以被赋值给变量、作为参数传递和作为其他函数的返回值。 首先,我们要理解函数是“第一等公民”的含义。在JavaScript中,函数可以像其他数据类型...

    函数式编程及实例

    函数式编程是一种编程范式,它强调通过使用纯函数、避免可变状态和副作用来解决问题。在JavaScript开发中,函数式编程的概念可以帮助我们编写出更简洁、可读性更强、易于测试和维护的代码。 纯函数是函数式编程的...

    JS函数式编程指南

    在这一章节中,作者首先引入了函数式编程的概念,并解释了为什么JavaScript是一种理想的用于学习函数式编程的语言。尽管JavaScript通常被视为一种命令式语言,但它同时也支持函数式编程的特点,这使得开发者能够在...

Global site tag (gtag.js) - Google Analytics