JS Function对象札记

Function对象

对象中的函数(方法)

当一个函数被保存为对象的一个属性时,我们称它为一个方法,当一个方法被调用时,this被绑定到该对象。

方法可以使用this访问自己所属的对象;

return

一个函数纵使会返回一个值。如果没有指定返回值,则返回 undefined。

如果函数调用时在前面加上了 new 前缀,且返回值不是一个对象, 则返回 this(该新对象);

在jquery的on方法下,得到绑定函数的返回值;


    var returnValue; //通过变量来存储函数的返回值;

function a(){
return 123456;
}

$(".h1").on("click",function a(){
returnValue = a();
alert(returnValue); // 123456
});

方法调用模式

当一个函数被保存为对象的一个属性时,我们称它为一个方法。当一个方法被调用时, this被绑定到该对象。 如果调用表达式包含一个提取属性的动作(既包含一个
. 点表达式或[subscript]下标表达式),那么它就是被当作一个方法来调用;

函数调用模式

当一个函数并非一个对象的属性时,那么它就是被当作一个函数来调用的:

var sum = add(3, 5); // sum的值为8;

以此模式调用函数时,this
被绑定到全局对象。这是语言设计上的一个错误,对于对象中方法的内部函数,如果我们需要让this指向对象但我们可以通过一个简单的方法:在方法定义一个变量并给它赋值为this,这样内部函数引用方法创建的变量,this的指向就是方法的所属对象了;


 1 var myObject = new Object();
2 myObject.value = 0;
3
4 function add(num){
5 return num * num;
6 }
7 myObject.double = function (){
8 var here = this; //指向为当前方法所属对象;
9
10 var helper = function (){
11 var that = this;//指向依旧为window;
12 that.value = add(50); //window.value = 2500;
13 here.value = add(100); //myObject.value = 10000;
14 }
15 helper();
16 }
17
18 myObject.double();
19 document.writeln((myObject.value)); //10000;
20 document.writeln((window.value)); //2500;

构造器调用模式

一个函数,如果创建的目的就是希望接合 new
前缀来调用,那么它就被称为构造器函数,按照约定,他们保存在首字母以大写格式命名的变量里。如果调用构造器函数时没有在前面加上
new,可能会发生非常糟糕的事,既没有编译时警告,也没有运行时警告,所以大写约定非常重要!(不推荐使用这种形式的构造函数,下一章有更好的替代方式[js语言精粹30页]);

Apply
调用模式

因为JS是一门函数式的面向对象编程语言,所以函数可以拥有方法。

apply 方法让我们构建一个参数数组传递给调用函数,它也允许我们选择 this 的值。 apply 方法接收两个参数, 第 1 个是要绑定给 this
的值,第 2 个就是一个参数数组. 1 function add(num1, num2){


 2                 return num1 + num2;
3 }
4
5 // 构造一个包含两个数字的数组,并将他们相加;
6 var array = [3, 4];
7 var sum = add.apply(this, array);
8 alert(sum);
9
10
11 var Quo = function (string) {
12 this.statues = string;
13 }
14
15 // 给 Quo 的所有实例提供一个名为 get_statues 的公共方法;
16
17 Quo.prototype.get_statues = function (){
18 return this.statues;
19 }
20
21 var statuesObject = {
22 statues: "A-OK"
23 };
24
25 var statues = Quo.prototype.get_statues.apply(statuesObject); //statues 值为 "A-OK";
26       
       

//以上 apply 的代码我还没弄明白- -

arguments
参数

当函数被调用时,会得到一个“免费“配送的参数, 那就是 arguments 数组,函数可以通过此参数访问所有它被调用时传递给它的参数列表。

因为语言的一个设计错误, arguments 并不是一个真正的数组, 它只是一个 ”类似数组 (array-like)“ 的对象。 arguments
拥有一个 length 属性,但它没有任何数组的方法。我们将会在本章结尾看到这个设计错误导致的后果 (语言精粹p30);

JS Function对象札记

时间: 2024-11-02 13:46:30

JS Function对象札记的相关文章

JS function的定义方法,及function对象的理解。

废话篇: 今天看到了javascript的原型链,各种指向,各种对象有木有,各种晕,各种混淆有木有.兼职是挑战个人脑经急转弯的极限啊.不过,最终这一难题还是被我攻克了,哇咔咔.现在就把这东西记下来,免得到时候又忘了就悲催了.... 正文篇: function的定义方法,及function对象的理解. 在我大js中秉承着一切都是对象的原则,不论是方法还是其他都不例外. 我们在使用java的时候经常要编写方法,这时候其用的关键字是function,而在js中我们在编写函数的时候也是用这个关键字,所以

认识js函数对象(Function Object)

认识函数对象(Function Object) 可以用function关键字定义一个函数,对于每个函数可以为其指定一个函数名,通过函 数名来进行调用.这些都是代码给用户的印象,而在JavaScript解释执行的时候,实际上每 个函数都是被维护为一个对象,这就是本小节将要介绍的函数对象(Function Object). 函数对象与其它用户所定义的对象有着本质的区别,这一类对象被称之为内部对象,例 如日期对象(Date).数组对象(Array).字符串对象(String)都是属于内部对象.换句话

原生JS:Function对象(apply、call、bind)详解

Function对象(apply.call.bind) 本文参考MDN做的详细整理,方便大家参考[MDN](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript) Function 构造器会创建一个新的 Function 对象. 在 JavaScript 中每个函数都是一个Function对象. 构造器 new Function ([arg1[, arg2[, ...argN]],] functionBody) arg1, arg2, .

认识JQuery,JQuery的优势、语法、多库冲突、JS原生对象和JQuery对象之间相互转换和DOM操作,常用的方法

(一)认识JQuery  JQuery是一个JavaScript库,它通过封装原生的JavaScript函数得到一套定义好的方法    JQuery的主旨:以更少的代码,实现更多的功能 (二)JQuery的优势 1)可以像CSS一样访问和操作DOM 2)修改CSS控制页面外观 3)简化JS代码操作 4)事件代理更加容易 5)动画效果使用方便 6) Ajax技术更加完美 7)大量的基于Jquery的插件 8)可以自定义扩展功能插件 (三)JQuery的语法 格式:$(selector).actio

js 遍历对象

function allPrpos(obj) { // 用来保存所有的属性名称和值 var props = ""; // 开始遍历 for(var p in obj){ // 方法 if(typeof(obj[p])=="function"){ obj[p](); }else{ // p 为属性名称,obj[p]为对应属性的值 props+= p + "=" + obj[p]+"<br />"; } } // 最后

js面对对象编程

说到js,很大一部分人会说我很熟悉,在日常的web开发中经常用,那么你的js代码是符合面对对象思路的吗?那你会问我面向过程的js代码有什么不好吗?我的感受是面对对象的js编码更加简洁,减少了混乱,可维护行增强,适合编写富客户端时应用. 好了,首先看看js里如何定义对象: <html> <head> <script type="text/javascript"> var obj=new Object(); obj.name='josh'; obj.ag

js复制对象

<script type="text/javascript"> function getType(o){ var _t; return ((_t = typeof(o)) == "object" ? o==null && "null" || Object.prototype.toString.call(o).slice(8,-1):_t).toLowerCase();}function extend(destinati

【JS工具对象系列】(1)URL工具对象

分享自己的js工具对象,如下为URL工具代码: urlUtil={ /** * 返回当前页面的url * @author chencha * @since 2014-07-04 */ getURL: function() { return document.URL; //大写哦! }, /** 返回url参数数组,分别有name和value属性 * @param {String} url - url字符串 * @author chencha * @since 2014-07-04 */ getU

js事件对象坐标

js事件对象坐标---贴上代码 <body style="position:relative;width:100%;height:100%;padding:15px;margin:20px;"> <div style="position:absolute;top:100px;left:100px;width:500px;height:500px;padding:5px;margin:9px;background:#ddd;" onclick=&qu