一:对象创建的方法 

//普通 字面量形式
var obj = {
name:'名字',
fn:function(){
console.log(this.name);
}
} //new 实例
var obj = new Object();
obj.name = '';
obj.age = ""; //构造函数
function obj (name,age){
this.name = name;
this.age = age;
this.fn = function(){
console.log(this.name);
}
} var n = new obj('字符串',33);

二:对象this指向

var a = {
name:'你好',
fn:function(){
//指向 对象本身
console.log(this.name);
var that = this;
function b(){
// 指向window 本身
console.log(that.name);
}
b()
}
}
a.fn();

  1.方法调用模式

    当函数被保存为一个对象的属性时,它就可称为这个对象的方法。当一个方法被调用时,this被绑定到这个对象上。如果调用表达式包含一个提取属性的动作(. 或 []),那么它被称为方法调用。例如:

var name = "window";
var obj = {
name: "kxy",
sayName: function() {
console.log(this.name);
}
};
obj.sayName(); //kxy

sayName函数作为对象obj的方法调用,所以函数体中的this就代表obj对象

  2.函数调用模式

当一个函数并非一个对象的属性时,那么它就是被当做函数来调用的。在此种模式下,this被绑定为全局对象,在浏览器环境下就是window对象。例如:

var name = "window";
function sayName() {
console.log(this.name);
}
sayName();

sayName以函数调用模式调用,所以函数体中的this代表window对象。

  3.构造函数模式

  如果在一个函数前面加上new关键字来调用,那么就会创建一个连接到该函数的prototype成员的新对象,同时,this会被绑定到这个新对象上。这种情况下,这个函数就可以成为此对象的构造函数。例如:

function Obj() {
this.name = "kxy";
}
var person = new Obj();
console.log(person.name); //kxy

Obj作为构造函数被调用,函数体内的this被绑定为新创建的对象person。

  4.apply调用模式

在JS中,函数也是对象,所有函数对象都有两个方法:apply和call,这两个方法可以让我们构建一个参数数组传递给调用函数,也允许我们改变this的值。例如:

var name = "window";
var person = {
name: "kxy"
};
function sayName() {
console.log(this.name);
}
sayName(); //window
sayName.apply(person); //kxy
sayName.apply(); //window

总结:对象中方法 this指向的是对象的本身。 如果对象的函数内部包涵其他函数的话,里面的函数this指向是window。  除非把this指向提取出来。

    函数中的this指向,只要不是构造实例,那么this 指向得是window。

js---对象 和 函数this的更多相关文章

  1. js对象及函数(四)

    一.对象1.函数对象的创建方法一:使用new构造函数去创建构造函数对象eg: var obj = new Object(); //向对象里面添加属性或方法 obj.name = 'nzc'; obj. ...

  2. js对象工厂函数与构造函数

    转自:http://www.cnblogs.com/Jener/p/5920963.html ★概述:         使用对象字面量,或者向空对象中动态地添加新成员,是最简单易用的对象创建方法.然而 ...

  3. js 对象与函数的区别

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  4. JS中的函数,Array对象,for-in语句,with语句,自定义对象,Prototype

    一)函数 A)JS中的函数的定义格式: function add(a,b) { var sum = a+b; document.write("两个数的和是:" + sum); // ...

  5. Js对象转String的函数 和 JSON转String

    js对象转string的函数 function obj2str(o){ var r = []; if(typeof o =="string") return "" ...

  6. js创建对象的三种方法:文本标识法和构造器函数法和返回对象的函数

    文本标识法和定义变量差不多,像这样 var obj = {name:'HanMM','2':'Dali'}; 函数构造器法  先创建一个对象函数 function Obj() { this.addre ...

  7. js中的函数,Date对象,Math对象和数组对象

    函数就是完成某个功能的一组语句,js中的函数由关键字 function + 函数名 + 一组参数定义;函数在定义后可以被重复调用,通常将常用的功能写成一个函数,利用函数可以使代码的组织结构更多清晰. ...

  8. 秒懂JS对象、构造器函数和原型对象之间的关系

    学习JS的过程中,想要掌握面向对象的程序设计风格,对象模型(原型和继承)是其中的重点和难点,拜读了各类经典书籍和各位前辈的技术文章,感觉都太过高深,花费了不少时间才搞明白(个人智商是硬伤/(ㄒoㄒ)/ ...

  9. JS对象、数据类型区别、函数

    对象 基本数据类型都是单一的值,值和值之间没有任何联系,变量之间独立,不能成为一个整体. 对象属于一种符合的数据类型,对象中可以保存对个不同数据类型的属性. 对象分类:  1.内建对象   由ES标准 ...

  10. jQuery的文件引入、入口函数以及js对象和jquery对象之间的互相转换

    JavaScript与jquery的区别 JavaScript是一门编程语言,用来编写客户端浏览器脚本. jQuery是javascript的一个库,包含多个可重用的函数,用来辅助简化javascri ...

随机推荐

  1. Idea的一些调试技巧及设置todo

    程序员的工作内容,除了大部分时间写代码之外,因为有不少的时间是用在调试代码上.甚至说不是在调试代码,就是即将调试代码. :) 今天我们来谈谈调试代码的一些技巧,在使用IDE提供的debugger时一些 ...

  2. iOS ReactiveCocoa 最全常用API整理(可做为手册查询)

    本文适合有一定RAC基础的童鞋做不时的查询,所以本文不做详细解释. 一.常见类 1.RACSiganl 信号类. RACEmptySignal :空信号,用来实现 RACSignal 的 +empty ...

  3. Embedding Flash Fullscreen in the Browser Window

    For Developers‎ > ‎Design Documents‎ > ‎ Embedding Flash Fullscreen in the Browser Window Auth ...

  4. 有用的 Bash 快捷键清单

    作者: Sk 译者: LCTT Sun Yongfei 现如今,我在终端上花的时间更多,尝试在命令行完成比在图形界面更多的工作.随着时间推移,我学了许多 BASH 的技巧.这是一份每个 Linux 用 ...

  5. tf.cast(ndarray,dtype)

    转化为指定的类型,一般是将bool类型转化为其他的数据类型,例如:tf.float32

  6. CSS 预处理语言之 less 篇

    less 前言 Less 是一门 CSS 预处理语言,它扩充了 CSS 语言,增加了诸如变量.混合(mixin).函数等功能,让 CSS 更易维护.方便制作主题.扩充. 安装 客户端使用 // 引入 ...

  7. opencv3.4.1和vs2017配置

    官网下载opencv,双击之后会将文件提取出来,提取出来的文件放在一个合适的位置(选个好地方,不要乱改,环境的配置依赖于这个目录),我放在了D:\program下 配置环境变量: 右键此电脑--> ...

  8. subline Text3 插件安装

    --没有解决,换了vscode 安装Package Control 这是必须的步骤,安装任何插件之前需要安装这个 自动安装的方法最方便,只需要在控制台(不是win的控制台,而是subline 的)里粘 ...

  9. 【Codeforces Round #420 (Div. 2) A】Okabe and Future Gadget Laboratory

    [题目链接]:http://codeforces.com/contest/821/problem/A [题意] 给你一个n*n的数组; 然后问你,是不是每个位置(x,y); 都能找到一个同一行的元素q ...

  10. HBase快照、Snapshots 淘宝快照

    淘宝在2011年之前所有的后端持久化存储基本上与我们所认知的意义,  大量存于 mysql .少量 oracle mongdb 等,使用mysql 的原因相信各位也很熟悉了.  开源.社区庞大.解决方 ...