<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>

<script type="text/javascript">
    //this的四种调用模式（this作用域）　　//在此声明，this仅仅是一个作用域的关键字，为了区分变量的作用域。（构造器调用模式）　　
    /**
     * 方法调用模式
     * 当一个函数被保存为对象的一个属性时，我们称它为一个方法，当方法被调用时，this指向该对象
     * @type {{value: number, getValue: getValue}}
     */
    var obj = {
        value : 'getValue() in Object',
        getValue : function() {
            alert(this.value);
        }
    };
    obj.getValue();     //alert 1

    /**
     * 函数调用模式
     * 当一个函数并非一个对象的属性时，它被当做一个函数来调用，此时的this指向全局变量（window）
     * @type {string}
     */
    window.value = 'getValue() not in Object';
    function getValue() {
        alert(this.value);
    }
    getValue();

    /**
     * 构造器调用模式
     * 结合new前缀调用的函数被称为构造器函数，此时的this指向构造器函数的实例对象
     * @param val
     */
    function show(val){
        this.value = val;
        //value = val;
    }
    show.prototype.getVal = function() {
        alert(this.value);
        //alert(value); show()方法中省略this，此处省略this可以显示正常结果。原因：变量提升。
    };
    var func = new show('constructor');
    func.getVal();

    /**
     * apply/call调用模式，对象冒充
     *
     * @param str
     */
    var fun = function(str) {
        this.stauts = str;
    };
    fun.prototype.getStatus = function () {
        alert(this.status);
    };
    var obj  = {
       status : 'loading'
    };
    fun.prototype.getStatus.apply(obj);　　　　//相当于 fun.prototype.getStatus.apply(obj, null);　
</script> </head> <body> </body> </html>

js中this的四种调用模式的更多相关文章

  1. JS面向对象函数的四种调用模式

    函数的四种调用模式 概念 在 js 中,无论是函数, 还是方法, 还是事件, 还是构造器,...这些东西的本质都是函数 函数, 方法, 事件, 构造器,...只是所处的位置不同 这四种模式分别是 函数 ...

  2. javascript中函数的四种调用模式详解

    介绍函数四种调用模式前,我们先来了解一下函数和方法的概念,其实函数和方法本质是一样,就是称呼不一样而已.函数:如果一个函数与任何对象关系,就称该函数为函数.方法:如果一个函数作为一个对象属性存在,我们 ...

  3. js高级-函数的四种调用模式

    1.对象方法调用模式  方法内部的this指向当前调用者的对象d 定义类 (构造函数) function Dog (dogName){ //创建一个空对象   让空对象==this this.name ...

  4. js中this的四种使用方法

    0x00:js中this的四种调用模式 1,方法调用模式 2,函数调用模式 3,构造器调用模式 4,apply.call.bind调用模式 0x01:第一种:方法调用模式 (也就是用.调用的)this ...

  5. JavaScript (JS) 函数补充 (含arguments、eval()、四种调用模式)

    1. 程序异常 ① try-catch语法    测试异常 try-catch语法代码如下: try { 异常代码;     try中可以承重异常代码, console.log(“try”)  出现异 ...

  6. 【转】JavaScript中的this关键字使用的四种调用模式

    http://blog.csdn.net/itpinpai/article/details/51004266 this关键字本意:这个.这里的意思.在JavaScript中是指每一个方法或函数都会有一 ...

  7. 函数的四种调用模式.上下文调用.call.apply

    闭包:函数就是一个闭包,一个封闭的作用域;         返回函数,要返回多个函数就用一个对象封装一下,         立即执行函数+return 回调函数   JS动态创建的DOM,不会被搜索引 ...

  8. 【温故知新】——原生js中常用的四种循环方式

    一.引言 本文主要是利用一个例子,讲一下原生js中常用的四种循环方式的使用与区别: 实现效果: 在网页中弹出框输入0   网页输出“欢迎下次光临” 在网页中弹出框输入1   网页输出“查询中……” 在 ...

  9. Android中Activity的四种启动模式

    要了解Android的启动模式先要了解一下Activity的管理方式: 1.Activity的管理机制 Android的管理主要是通过Activity栈来进行的.当一个Activity启动时,系统根据 ...

随机推荐

  1. 如何查看Linux的系统是64位的还是32位的

    可以用命令“getconf LONG_BIT”查看,如果返回的结果是32则说明是32位,返回的结果是64则说明是64位. 此外还可以使用命令“uname -a”查看,输出的结果中,如果有x86_64就 ...

  2. GPRM/GNRMC定位信息的读取与解析

    帧头 UTC时间 状态 纬度 北纬/南纬 经度 东经/西经 速度 $GPRMC hhmmss.sss A/V ddmm.mmmm N/S dddmm.mmmm E/W 节 方位角 UTC日期 磁偏角 ...

  3. 表单验证Jquery扩展方法类

    /** 表单数据验证 **/ $.fn.Validform = function () { var Validatemsg = ""; var Validateflag = tru ...

  4. 用户管理 之 在Linux系统中，批量添加用户的操作流程

    一.阅读此文件您需要掌握的基础知识: <Linux 用户(user)和用户组(group)管理概述><用户(user)和用户组(group)配置文件详解><Linux 用 ...

  5. 用户管理 之 Linux 用户（User）查询篇

    用户(User)和用户组(Group)的配置文件,是系统管理员最应该了解和掌握的系统基础文件之一,从另一方面来说,了解这些文件也是系统安全管理的重要组成部份:做为一个合格的系统管理员应该对用户和用户组 ...

  6. Codeforces 346C Number Transformation II 构造

    题目链接:点击打开链接 = = 990+ms卡过 #include<stdio.h> #include<iostream> #include<string.h> # ...

  7. Mac 上面使用SVN的攻略

    参考网站: http://blog.csdn.net/q199109106q/article/details/8655204 SVN命令集: http://www.blogjava.net/jasmi ...

  8. iOS10 CoreData新特性

    原文地址:What's New in Core Data in macOS 10.12, iOS 10.0, tvOS 10.0, and watchOS 3.0 翻译者:肖品,原创文章转载请著名出处 ...

  9. [原创]Andorid DexClassLoader的创建过程解析（基于5.0）

    做Android插件框架时,经常会用到dex的动态加载,就要直接或间接的使用DexClassLoader,在new DexClassLoader的时候Android系统做了很多工作,下面我们详细分析一 ...

  10. 130 个你需要了解的 vim 命令

    基础 :e filename Open filename for edition :w Save file :q Exit Vim :q! Quit without saving :x Write f ...