美文网首页程序员
JavaScript - 函数和对象

JavaScript - 函数和对象

作者: NARUTO_86 | 来源:发表于2014-08-29 22:43 被阅读142次

    JavaScript 函数和对象

    首先是一段独白,与正文无关,可直接跳过下面的段落。

    接下来要聊的东西我还没有特别清晰的思路,不过考虑到我们都是“在路上”,所以没必要面面俱到。因此,我会把我了解的,平时用到的,都拿出来分享。但这些显然不是我们现在涉及的领域的全部,甚至可能不是主要的部分。不过,相信你并不会因此而苛责我吧,因为你毕竟不是在读一本专业书,带着挑剔的专业的眼光(_)。

    函数与对象啥关系

    在 JavaScript 中,很多东西都可以看做对象,不过就像咱们青年也分为:2B青年,普通青年与文艺青年一样,在这里请允许我冒昧地把 JavaScript 中的对象也分分类。当然,请注意,我保证这不会是官方的或者是学术上的分类。

    在这里,我把 JavaScript 的对象分为:

    • 隐式对象:包括数值,字符串,数组。
    • 内置对象:由语法规范定义或由运行环境提供的一些对象,例如正则表达式、日期、HTMLElement 对象等等。
    • 普通对象:简单来说就是类似{ name: "luobo" }这样声明的一个对象。
    • 函数对象:其实就是函数,但同样也是对象,只不过有被“调用”的“大招”。

    隐式对象

    举个栗子:

    var s = "Hello, luobo!";
    s.substr(7, 5); // "luobo"
    

    把这里的 s 看做对象,是因为它有“方法”啊!你说是不是很合理啊。当然,任何道理有时候都像是“强词夺理”,你懂得。

    不过,我不把 new String("Hello, luobo"); 这样得到的对象归于此类哈,这个我归于下一类。

    内置对象

    就是在特定的运行环境中可以通过 new XXX() 这种方式得到的对象,或者通过一定的方法可以得到,但自己没法直接创建的东东(如 HTMLElement,没法自己通过 {...} 这样直接声明得到哦),当然,这个东东得像“对象”才行。

    我所说的像“对象”,其实并无“深意”。所谓的对象还不就是一个能够保存数据,并且可选地提供了一些“方法”的东西嘛。(当然,你有权吐槽,欢迎)

    普通对象

    这是自己可以创造的,例如{ name: "luobo" }就得到了这样一个对象。或者通过某种方式(这里不多说,后面再讨论哈)基于自己的定义通过函数创造的对象,类似于:

    function Person(name) {
        this.name = name;
    }
    
    var me = new Person("luobo");
    me.name; // "luobo"
    

    因为这个 Person 是自个整出来的,所以不能算是“内置”的是吧,毕竟咱们得讲道理不是。然后这个对象是和你创造它的预期相符的,你让它有啥属性、方法,它就得有不是。所以,这么老实听话的,就是“普通”对象啦。

    函数对象

    函数对象当然是通过这种方式定义的:

    function HelloWorld() {
        console.log("Hello, world!");
    }
    

    这里的HelloWorld就是个函数,多简单。

    当然,也可以这样定义函数:

    function () {
        console.log("Hello, world!");
    }
    

    其实上面这个函数和上上面的那个其实一样。当然,如果你认真看的话,会发现它没有“名字”,然而这也就是没有名字而已,函数本身已经创建了,而且可以用了。只不过,没有名字所以用的时候不是那么的“直白”而已。你可以这样用:

    (function () {
        console.log("Hello, world!");
    })();
    

    这样就调用了,是不是很....傻啊。其实我写过好多这样的代码,主要的目的不是为了定义这个函数,而是为了把东西放到这个函数内部执行。为啥这样呢?我以后讲。(当然,更推荐你自己看书了解啦)

    函数

    上面栗子中的 HelloWorld 只是个名字而已,你也可以把它作为一个“变量”,这个变量的“值”就是一个函数对象啦。所以,也可以这样来定义函数:

    var HelloWorld = function () {
        console.log("Hello, world!");
    }
    

    据我了解,在一些编程语言中(对,包括Java),有“值”、“引用”的说法。在JavaScript中,不能说就完全没有这些东西,但是我在一些书和资料里很少看到专门讨论这些的。我想还是由于一些习惯,导致不那么看重这些吧。例如由于闭包的存在,就会出现一些奇妙的现象,这个我也放到后面的文章再说吧(嗯,待我再整理、积累下,毕竟闭包这种东西有些“高级”)。

    还是来说函数,先说说函数可以被调用这件事吧。当然,这是显而易见的。

    还是说上面的HelloWorld函数,可以这样调用:HelloWorld(),这是普通青年的做法。当然你也可以文艺些这样来:HelloWorld.call(),还是会输出结果的。但是这样用的话,你看待HelloWorld的视角就变了,这个时候,你就可以把它看作是一个对象,这个对象有一个方法call(),作用呢,就是调用你的这个函数,是不是完全不一样啦!

    除了call(),还有apply()方法,也是可以用来调用函数的,它们的相似和不同之处,不在此展开了(欢迎查资料自己了解)。通过介绍call(),貌似我再说函数是一个对象时,就更容易理解了。当然,还有更让人“信服”的栗子:

    HelloWorld.version = "v0.1";
    

    嗯,这个函数还有版本啊,厉害。不对,这个家伙还可以设置属性!不仅如此:

    HelloWorld.sayHello = function () {
        console.log("Hello!");
    };
    

    还可以定义方法呢。所以,它当然是个对象,不过是个可以被“调用”的对象。

    举个实际中的栗子,我们在用 jQuery 的时候可能都写过类似的代码:

    $('#myDiv').css('color', 'red');
    $.ajax({ url: '/foo.jsp' });
    

    有没有注意到,上面两行对 $ 的使用是不同的。第一行是直接调用$函数(对,$就是个函数),第二行则是调用$对象($也是个对象哦,因为函数都是对象嘛)的方法ajax。怎么样,是不是“茅塞顿开”?(当然你可能早就知道,不过我之前搞清楚这个的时候可是兴奋得很啊!)

    函数生成对象

    这是一个比较“高级”的话题啦(相对我来说,不是你哈),我不打算展开,因为想在后面讲 JavaScript 中的“继承”的时候再多说一些。先看个栗子:

    function Person(name) {
        return {
            name: name
        };
    }
    

    这里定义的函数Person就可以生成对象,怎么样,很简单吧?

    你不会打死我吧....

    但是,当你看到这个的时候:

    var me = new Person("luobo");
    me.name; // "luobo"
    

    你有何感想?

    好了,就写到这吧。

    相关文章

      网友评论

        本文标题:JavaScript - 函数和对象

        本文链接:https://www.haomeiwen.com/subject/pkdytttx.html