angular.bind使用心得


Posted in Javascript onOctober 26, 2015

angular.bind

解释:返回一个调用self的函数fn(self代表fn里的this).可以给fn提供参数args(*).这个功能也被称为局部操作,以区别功能。

格式:angular.bind(self,fn,args);

self:object  对象; fn的上下文对象,在fn中可以用this调用

fn:function; 绑定的方法

args:传入fn的参数

var obj = { name: "Any" };
  var fn = function (Adj) {
    console.log(this.name + "is a boy!!! And he is " + Adj + " !!!");
  };
  var f = angular.bind(obj, fn, "handsome");
  f();//Any is a boy!!! And he is handsome!!!
  var t = angular.bind(obj, fn);
  t("ugly");// Any is a boy!!! And he is ugly!!!

接下来说说对angular.bind的理解吧~

bind顾名思义绑定的意思,那么假如我们要把A绑到B上,那么必须又有A和B这2个存在体。这里需要的2个存在体就一个对象和一个函数。那么怎么绑?@野兽的理解是把对象“绑”到函数的this上去执行,这时候fn的this就等于obj了,至于第三个参数,可有可无,看需求,如果函数需要传入参数,那么我们可以把angular.bind的第三个参数放上去,这就是传入fn函数的参数了。

案例中第一种写法是定义绑定的时候就把fn所需的参数传进去了,调用的时候直接用,而案例中第二种写法是先绑定,在调用执行的时候再给fn传参,效果是一样的

对于那上面的英文句子(好吧,虽然只有2句),如果有写错了,那么说明深深的爱着我们的母语-中文;如果一不小心写对了,那么请为这个装的66666的B鼓掌~

文章最后,我们来看个实例吧

<!DOCTYPE HTML>
<html ng-app>
<head>
</head>
<script src="http://code.angularjs.org/1.2.3/angular.min.js"></script>
</body>
<script>
   
 var self = {name:'boyi'};
 
 //示例1--带参数
 var f = angular.bind(self, //绑定对象,作为函数的上下文
  //被绑定的函数
  function(age){ 
   alert(this.name + ' is ' + age + ' !');
  },
  //绑定的参数,可省略
  '15'
 );
 f();//调用绑定之后的function
  
 //示例2--不带参数
 var m = angular.bind(self, //绑定对象,作为函数的上下文
  //被绑定的函数
  function(age){ 
   alert(this.name + ' is ' + age + ' !');
  }
  //省略参数
 );
  
 m(3);//调用传参的函数		
 
</script>

</body>	
</html>
Javascript 相关文章推荐
javascript 获取网页参数系统
Jul 19 Javascript
分享一个asp.net pager分页控件
Jan 04 Javascript
javascript针对DOM的应用分析(三)
Apr 15 Javascript
Jquery仿IGoogle实现可拖动窗口示例代码
Aug 22 Javascript
javascript如何操作HTML下拉列表标签
Aug 20 Javascript
PHP抓取HTTPS内容和错误处理的方法
Sep 30 Javascript
jQuery使用bind函数实现绑定多个事件的方法
Oct 11 jQuery
JavaScript常见继承模式实例小结
Jan 11 Javascript
jQuery实现图片随机切换、抽奖功能(实例代码)
Oct 23 jQuery
你知道JavaScript Symbol类型怎么用吗
Jan 08 Javascript
微信小程序实现下滑到底部自动翻页功能
Mar 07 Javascript
vue 获取url参数、get参数返回数组的操作
Nov 12 Javascript
详解JavaScript编程中正则表达式的使用
Oct 25 #Javascript
实例解析JS布尔对象的toString()方法和valueOf()方法
Oct 25 #Javascript
JavaScript编程中布尔对象的基本使用
Oct 25 #Javascript
举例讲解JavaScript中将数组元素转换为字符串的方法
Oct 25 #Javascript
javascript学习笔记整理(概述、变量、数据类型简介)
Oct 25 #Javascript
js实现跨域的几种方法汇总(图片ping、JSONP和CORS)
Oct 25 #Javascript
详解JavaScript编程中的数组结构
Oct 24 #Javascript
You might like
给php新手谈谈我的学习心得
2007/02/25 PHP
PHP中调用ASP.NET的WebService的代码
2011/04/22 PHP
浅析php创建者模式
2014/11/25 PHP
php版微信公众账号第三方管理工具开发简明教程
2016/09/23 PHP
PHP函数积累总结
2019/03/19 PHP
javascript 写类方式之二
2009/07/05 Javascript
禁止选中文字兼容IE、Chrome、FF等
2013/09/04 Javascript
jquery表单验证插件(jquery.validate.js)的3种使用方式
2015/03/28 Javascript
JavaScript中exec函数用法实例分析
2015/06/08 Javascript
js实现获取两个日期之间所有日期的方法
2016/06/17 Javascript
JSON 必知必会 观后记
2016/10/27 Javascript
JavaScript实现翻页功能(附效果图)
2017/02/16 Javascript
JavaScript切换搜索引擎的导航网页搜索框实例代码
2017/06/11 Javascript
JS中关于正则的巧妙操作
2017/08/31 Javascript
VueCli3构建TS项目的方法步骤
2018/11/07 Javascript
Vue传参一箩筐(页面、组件)
2019/04/04 Javascript
vue如何获取自定义元素属性参数值的方法
2019/05/14 Javascript
生成无限制的微信小程序码的示例代码
2019/09/20 Javascript
原生javascript单例模式的应用实例分析
2020/02/23 Javascript
Python爬虫抓取代理IP并检验可用性的实例
2018/05/07 Python
解决pycharm每次新建项目都要重新安装一些第三方库的问题
2019/01/17 Python
python中logging模块的一些简单用法的使用
2019/02/22 Python
使用Python控制摄像头拍照并发邮件
2019/04/23 Python
在Python IDLE 下调用anaconda中的库教程
2020/03/09 Python
python实现UDP协议下的文件传输
2020/03/20 Python
python datetime处理时间小结
2020/04/16 Python
Pytorch 高效使用GPU的操作
2020/06/27 Python
New Balance法国官方网站:购买鞋子和服装
2019/09/01 全球购物
澳大利亚领先的时尚内衣零售商:Bras N Things
2020/07/28 全球购物
学生爱国演讲稿
2014/01/14 职场文书
信息学院毕业生自荐信范文
2014/03/04 职场文书
公司节能减排方案
2014/05/16 职场文书
文秘应届生求职信
2014/07/05 职场文书
环境科学专业教师求职信
2014/07/12 职场文书
2016会计专业自荐信范文
2016/01/28 职场文书
十大最强火系宝可梦,喷火龙上榜,第一名有双火属性
2022/03/18 日漫