这是第一篇关于javascript模块的文章,在javascript入门的目录下,主要是记录一些对网上精彩的js研读碰到的疑惑,并做一些实验和探索

关于js中的对象和方法的定义博主感到非常的迷惑。针对这一点开始了一系列的探索。
     <script type="text/javascript">
function fun(){
alert("good");
var age = 1;
this.name = 'Mr S.G';
this.method = fun2;
}
function fun2(){
alert("this is the second method show");
}
function fun1(){
var obj = new fun();
alert(obj.name);
obj.method();
alert(obj.age);
}
window.onload = fun1;
</script>
在fun1()方法中通过var obj = new
fun()创建了一个对象。 fun() 是一个特殊的函数 构造函数,它和普通的函数有什么区别和联系我将在下边谈论。
注意到上边有两种形式定义变量。this.name  和 var age
.其实通过this方式创建的变量叫做对象的成员变量,可以在外部通过对象引用。而 var age 是一个局部变量 (如果放到外层,是一个全局变量)
这个变量不能被对象在外部引用(如obj.age)否则是undefine,可以将它看成是一个对象的私有成员变量。
接下来看看看构造函数的执行过程。首先执行var
obj = new
fun()这一步后,记录现场,然后跳到fun()的构造函数中,执行alert("good")跳出对话框。接下来就是创建成员变量了(如java
中在堆中创建内存空间,创建栈)。 好了fun()执行完了,回到fun1(),执行下去。注意一点,alert(obj.age)是undefine.
我现在想知道哪些函数可以new(),哪些不可以new().
     <script type="text/javascript">
function fun2(){
alert("this is the second method show"); }
function fun1(){
var obj = new fun2();
alert(obj);
alert('if display there no erro through the call');
}
window.onload = fun1;
</script>
这里 function
fun2()是一个函数,但是它是构造函数吗?
你可以将它当做一个构造函数。这里会发现fun1()中的alert()可以正常执行。这里可以总结为任何函数都可以new,在js中函数就是对象。但是
试想一下这里new有意义吗? fun2()中没有变量,或者都是var 定义的变量,那么在外部引用不了。new它干嘛呢?
,还不如让fun2()作为全局函数执行好了。 
这里可以回答本章的要探索的问题了: 任何函数都是构造函数,如果通过new就可以得到一个对象。通过函数不同的上下文调用分下面几种:
(1). 当在一个函数调用之前有new关键字,则上下文为新建的对象;
//任何函数可以new 创建一个对象
(2). 当一个函数使用call或者apply调用时,给定的第一个参数即为上下文;
//构造方法中可以写成员方法。然后通过对象来调用
(3). 否则,如果一个函数作为一个对象的属性(obj.func)或者obj['func'])来调用时,它就把该对象作为上下文来运行;
//上边new fun2()没意义,直接 fun2()调用,这里在全局上下文运行
(4)如果与上述几条都不符的话,则函数将在全局上下文中运行。
不是说构造函数可以写成员方法吗?
那么普通方法也可以算是构造函数,那么我在普通方法中在写方法,方法的嵌套。行不行?
     <script type="text/javascript">
function fun2(){
var name = "Mr S.G";
var method = function(){
alert("define a function");
}
alert(method);
method();
}
function fun1(){
var obj = new fun2();
alert(obj);
alert('if display there no erro through the call');
}
window.onload = fun1;
</script>

额,为什么我称fun2()是一个普通的函数呢?因为它没有this.这个是按照自己的理解来命名的。 这里fun2()定义一个匿名函数,由method引用。method()进行调用。 这里行的通。

下面我要变一下了。我要让fun2()的method能在fun1()调用,该怎么办?

     <script type="text/javascript">
function fun2(){
var name = "Mr S.G";
var method = function(){
alert("define a function");
}
alert(method);
this.fun3 = method;
}
function fun1(){
var obj = new fun2();
obj.fun3();
alert(obj);
alert('if display there no erro through the call');
}
window.onload = fun1;
</script>
这里通过 var obj = new fun2()就非常有意义了,我可以通过obj.fun3()进行引用了。

关于javascript中的构造函数和普通函数探索 [转]的更多相关文章

  1. JavaScript中的构造函数和工厂函数说明

    在cnblog上看到一篇文章,讲解JS中的构造函数和工厂函数,觉得讲的真好 JavaScript中的工厂函数和构造函数都能用来创建一个对象,我们可以来看看下面的例子 构造函数 function cre ...

  2. JavaScript中常见的数组操作函数及用法

    JavaScript中常见的数组操作函数及用法 昨天写了个帖子,汇总了下常见的JavaScript中的字符串操作函数及用法.今天正好有时间,也去把JavaScript中常见的数组操作函数及用法总结一下 ...

  3. JavaScript中常见的字符串操作函数及用法

    JavaScript中常见的字符串操作函数及用法 最近几次参加前端实习生招聘的笔试,发现很多笔试题都会考到字符串的处理,比方说去哪儿网笔试题.淘宝的笔试题等.如果你经常参加笔试或者也是一个过来人,相信 ...

  4. 一篇文章把你带入到JavaScript中的闭包与高级函数

    在JavaScript中,函数是一等公民.JavaScript是一门面向对象的编程语言,但是同时也有很多函数式编程的特性,如Lambda表达式,闭包,高阶函数等,函数式编程时一种编程范式. funct ...

  5. JavaScript中的构造函数和原型!

    JavaScript中的原型! 原型的内容是涉及到JavaScript中的构造函数的 每一个构造函数都有一个原型对象!prototype 他的作用是 共享方法!还可以扩展内置对象[对原来的内置对象进行 ...

  6. JavaScript中以构造函数的方式调用函数

    转自:http://www.cnblogs.com/Saints/p/6012188.html 构造器函数(Constructor functions)的定义和任何其它函数一样,我们可以使用函数声明. ...

  7. JavaScript中的闭包和匿名函数

    JavaScript中的匿名函数及函数的闭包   1.匿名函数 2.闭包 3.举例 4.注意 1.匿名函数 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没 ...

  8. JavaScript中的构造函数

    目录: constructor & prototype 为构造函数添加属性和方法的多种不同方法 组合使用this和prototype关键字创建构造函数(常用方法) 用对象直接量作为构造函数的参 ...

  9. JavaScript中为什么使用立即执行函数来封装模块?

    最近在学习JavaScript基础,在学习到面向对象编程时,学习到在JavaScript中实现模块化的方法,其中一个重要的点是如何封装私有变量. 实现封装私有变量的方法主要是: 使用构造函数 func ...

随机推荐

  1. [php代码审计] Window api函数 FindFirstFile 在php中的问题

    include文件夹中文件: 内容: <?php echo __FILE__; ?> index.php: 演示如下: “<<”替换多个任意字符: “>”替换单个字符:

  2. 理解Promise (3)

    在promise  的then  中我们不仅有 成功状态 失败状态,可能还有等待状态,所以我们要对等待状态进行处理 function Promise(executor) { let self = th ...

  3. DOM 操作表格

    操作表格<table>标签是 HTML 中结构最为复杂的一个,我们可以通过 DOM 来创建生成它,或者 HTML DOM 来操作它.(PS:HTML DOM 提供了更加方便快捷的方式来操作 ...

  4. Java类加载器初识

    类加载器基本概念 类加载器(class loader)用来加载 Java 类到 Java 虚拟机中.一般来说,Java虚拟机使用Java类的方式如下:Java 源程序(.java 文件)在经过 Jav ...

  5. nodejs廖雪峰大神教程

    https://www.liaoxuefeng.com/wiki/1022910821149312/1023025235359040

  6. Linux下MySQL 5.5的修改字符集编码为UTF8(彻底解决中文乱码问题)

    一.登录MySQL查看用SHOW VARIABLES LIKE 'character%';下字符集,显示如下: +--------------------------+---------------- ...

  7. 多行文本溢出隐藏处理,兼容ie,火狐

    问题 多行文本溢出隐藏,webkit内核浏览器如谷歌支持如下写法: overflow: hidden; text-overflow: ellipsis; display: -webkit-box; - ...

  8. QQ空间分享网址

    现在大部分网站都在每个界面设计了分享这个功能,但还是有的网页没有(比如 B 站只能分享具体的视频).在原来的 QQ 空间分享的地方已经找不到法自己创建分享.上网一搜有分享的接口,可这个接口是给开发者用 ...

  9. delphi 获得时间戳 毫秒数

    function DateTimeToMilliseconds(const ADateTime: TDateTime): Int64; //获得毫秒var LTimeStamp: TTimeStamp ...

  10. Nginx 模块 - ngx_http_rewrite_module

    原文地址 ngx_http_rewrite_module 模块用于通过 PCRE 正则表达式改变请求 URI,返回重定向并可以有条件地选择配置. break.if.return.rewrite 以及 ...