在javascirpt 世界中,所有的函数都是对象,并且还可以被用来创建对象。

function make_person(firstname, lastname, age) {
person = {};
person.firstname = firstname;
person.lastname = lastname;
person.age = age;
return person;
}
make_person("Joe", "Smith", 23);
// {firstname: "Joe", lastname: "Smith", age: 23}

但是,为了能够创建一个特定类型的对象(也就是能继承原型,拥有一个构造器的那种), 函数能获取this引用而且如果这个函数式通过new关键字,这个函数会返回一个包含了所有的定义在this上的属性的对象。 在这种情况下, this引用指向的是这个我们新创建的对象。

function make_person_object(firstname, lastname, age) {
this.firstname = firstname;
this.lastname = lastname;
this.age = age;
// 注意,我们并没有return语句。
}

make_person 和 make_person_object 两者最关键的不同是:

1. 对于make_person,无论我们是去通过new关键字去调用 make_person() 还是直接简单的调用make_person(), 这两者没有任何区别, 两个都会产生同样的对象。

2. 但是对于make_person_object, 如果我们不是通过new关键字去调用的,this将指向的是不确定的对象,如果make_person_object,是个全局函数,那this一般指向的是window对象, 那我们在this上定义的firstname, lastname, age属性,其实是赋给了window对象。

var Joe = make_person_object("Joe", "Smith", 23);
console.log(Joe); // undefined
console.log(window.firstname) // "Joe" (oops) var John = new make_person_object("John", "Smith", 45);
console.log(John); // {firstname: "John", lastname: "Smith", age: 45}

正如我上面说的,通过make_person_object方式去创建对象,能让我们事后对person对象增加方法和属性

make_person_object.prototype.full_name = "N/A";
make_person_object.prototype.greet = function(){
console.log("Hello! I'm", this.full_name, "Call me", this.firstname);
};
John.full_name // "N/A"
John.full_name = "John Smith";
make_person_object.full_name // Still "N/A"
John.greet(); // "Hello! I'm John Smith Call me John"

当然,还要注意,传统意义上讲,构造器类型的函数名称如:make_person_object应该是大写的,单个单词,是个名词,所有我们应该定义一个Person构造器而不是make_person_object.

JavaScript 函数和对象的更多相关文章

  1. javascript 函数与对象

    javascript中的函数是非常重要的概念,也是比较难于理解的一个知识点! 下面就来聊聊函数: JS基于对象:什么是基于对象呢?简单的说所有代码都是"对象"; 比如函数: fun ...

  2. 2015第37周五javascript函数arguments对象巧用一

    Javascript函数的一个巧妙利用:假定action中有一个JSONObject类型的对象data,其值有可能为空,则前台JSP页面的JS代码中想直接通过EL表达式,即${data}的形式访问对象 ...

  3. 【JS小技巧】JavaScript 函数用作对象的隐藏问题

    用户反馈 @消失的键盘 在论坛反馈了一个问题,在 AppBoxMvc 中的 Title 模型中,如果将 Name 属性改名为小写的 name 属性,就会报错: 因为这是一个 ASP.NET MVC 的 ...

  4. JavaScript函数与对象

    函数 函数的定义 JavaScript中的函数和Python中的非常类似,只是定义方式有点区别. // 普通函数定义 function f1() { console.log("Hello w ...

  5. 【JS小技巧】JavaScript 函数用作对象的隐藏问题(F.ui.name)

    用户反馈 @消失的键盘 在论坛反馈了一个问题,在 AppBoxMvc 中的 Title 模型中,如果将 Name 属性改名为小写的 name 属性,就会报错: 因为这是一个 ASP.NET MVC 的 ...

  6. JavaScript 函数与对象的 简单区别

    直接上例子 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <met ...

  7. 第二章JavaScript 函数和对象

    1 JavaScript 函数 1.1 声明函数的方式 function 关键字 匿名函数方式(表达式方式) Function 构造函数方式 1.2 参数问题 形参和实参数量问题 可选形参(参数默认值 ...

  8. JavaScript函数、对象和数组

    一.JavaScript函数 1.定义函数:函数的通用语法如下 function function_name([parameter [, ...]]) { statements; } 由关键字func ...

  9. JavaScript学习笔记(二)——闭包、IIFE、apply、函数与对象

    一.闭包(Closure) 1.1.闭包相关的问题 请在页面中放10个div,每个div中放入字母a-j,当点击每一个div时显示索引号,如第1个div显示0,第10个显示9:方法:找到所有的div, ...

随机推荐

  1. iOS-Storyboad动态刷新

    iOS-Storyboad动态刷新 什么叫做Storyboard动态刷新 在项目开发中,如果可以在xib(storyboard)中,动态显示运行效果图,那么实在是太爽了.在Xcode 6之后就为我们提 ...

  2. Java基础知识强化之集合框架笔记41:Set集合之HashSet存储自定义对象并遍历练习

    1. HashSet集合存储自定义对象并遍历.如果对象的成员变量值相同即为同一个对象 注意了: 你使用的是HashSet集合,这个集合的底层是哈希表结构. 而哈希表结构底层依赖:hashCode()和 ...

  3. Codeforces 231E - Cactus

    231E - Cactus 给一个10^5个点的无向图,每个点最多属于一个环,规定两点之间的简单路:从起点到终点,经过的边不重复 给10^5个询问,每个询问两个点,问这两个点之间有多少条简单路. 挺综 ...

  4. asp.net 的状态管理

    状态管理 (state management) 在Web应用程序中,一向是很重要的课题,良好的状态管理可以帮助开发人员发展出具有状态持续能力的应用程序(像是工作流程型应用程序或是电子商务应用程序),但 ...

  5. javascript动画效果

    之前工作项目中,运用了缓动动画的效果,在网上看到其他大牛写的相关公式,结合工作需要,进行了整理,拿出来跟大家分享下,js代码中,只运用了一个小功能进行了测试 <!DOCTYPE html> ...

  6. 关于promise

    后来发现promise是解决异步的一个链式调用的好的方法,避免了所谓的回调的监狱, 它有三个状态,未作为,已经完成和已经失败,起始是未作为,然后有了动作总会有个结果, 分成resolve,已经顺利ok ...

  7. get 和 post的使用.

    Two commonly used methods for a request-response between a client and server are: GET and POST. GET  ...

  8. XML有哪些解析方式有何优缺点?xml有哪些解析技术?区别是什么?

    有DOM,SAX,STAX等 (1):DOM:处理大型文件时其性能下降的非常厉害.这个问题是由DOM的树结构所造成的,这种结构占用的内存较多,而且DOM必须在解析文件之前把整个文档装入内存,适合对XM ...

  9. 微信小程序开发之 下拉刷新,上拉加载更多

    本文记载了如何在微信小程序里面实现下拉刷新,上拉加载更多 先开看一下界面 大致如此的界面吧. 这个Demo使用了微信的几个Api和事件,我先列出来. 1.wx.request (获取远程服务器的数据, ...

  10. 你好,C++(2)1.3 C++世界版图1.4 如何学好C++

    1.3  C++世界版图 C++语言的发展过程,不仅是一个特性不断增加.内容不断丰富的过程,更是一个在应用领域中不断攻城略地的过程.在其30余年的发展过程中,C++在多个应用领域都得到了广泛的应用和发 ...