javascript--自定义对象

潇洒

发布于 2023-10-20 10:11:57

2320

发布于 2023-10-20 10:11:57

文章被收录于专栏：石头岛

前言

JS对象是一种复合类型，它允许你通过变量名存储和访问，换一种思路，对象是一个无序的属性集合，集合中的每一项都由名称和值组成（听起来是不是很像我们常听说的HASH表、字典、健/值对？），而其中的值类型可能是内置类型(如number,string)，也可能是对象。这种方式不能用new方式创建，所以不可重用。

字面量方式-最简单方式

这种创建对象的方式通过{}来组织对象属性和方法。

var emptyObj = {
    'id': 1，   //注意是逗号
    'name': 'zhagnsan',
    'fn1': function(){
        //使有 this 调用方法
        this.fn2()
        //"此处是js对象的方法，可以写不限个，注意冒号，逗号"
        alert(this.id);        //同样可以用this方法。
    },
    'fn2': function(){
        alert(this['id']);//以集合的方式访问。
    }
};

对象的方法调用

emptyObj.fn1();
emptyObj.fn2();

绑定：如果使用这种方式进行绑定，则需要进行一次方法调用，才会生效，不像之前任意放在 script 代码块中就可以生效的对象要用自己的方法，使用 this 进行调用。

构造函数方式

可重用，先像Java一样创建一个对象的模板，然后new一个出来。this在里面的用法一样的。第二种创建对象的方式。这种方式就像Java一样，先创建一个对象的模板:

定义一个js类

function myClass(){
    this.id = 5;
    this.name = 'myClass';
    this.getName = function(){
        alert(this.name);
        return this.name
    }
}

创建对象：

var my = new myClass();
my.getName();
alert(my.id);

工厂方式

返回一个对象给函数

// 定义一个工厂函数
function myClass() {
  var obj = {
      'id':2,
      'name':'myclass'
  };
  return obj;
}

function _myClass() {
  var obj = new Object();
  obj.id = 1;
  obj.name = '_myclass';
  return obj;
}

打印一下：

var my = new myClass();
var _my = new _myClass();
alert(my.id);
alert(my.name);
alert(_my.id);
alert(_my.name);

带参方式

在使用百度地图API时，碰到一种调用方式，没有见过有一时搞不明白是怎么回事。研实了一下才明白。 js中使用this时可以直接指向方法名，不需要加()。 new 出来的对象调用方法属性时，要看构造函数中的this是指向谁的，注意。

构造函数的this的用引指向，直接影响到new 的时候的指针引用。

function fun(e) {
    alert(e);
}

function test(value, fun) {
    this.value = value;
    this.fun = fun;                //指向形参
}
var funTest = new fun("aaaa");
var obj = new test(11, funTest);
obj.fun();

匿名函数方式，匿名函数指向当前匿名函数。

function fun(e) {
    alert(e+"2");
}

function test(value, fun) {
    this.value = value;
    this.fun = fun;                //指向形参
}

var obj = new test(22, function(e){
    alert(e+"1");
});
obj.fun("aaaaaaaaaaa")

结果打印：aaaaaaaaaaa1

改变构造函数中的this指向，new的对象指向名部方法。

function fun(e) {        //指向这里
    alert(e+"2");
}

function test(value, ttt) {
    this.value = value;
    this.fun = fun;
                //！！！！注意，指向的是fun方法，ttt参数没有起做用，在局部没有找到变量，则直接找表达式右边的方法名。
}
var obj = new test(22, function(e){
    alert(e+"1");
});
obj.fun("aaaaaaaaaaa");

结果打印：aaaaaaaaaa2

总结：实际应用中不要出现this引用不清楚的清况。

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2015-02-28，如有侵权请联系 cloudcommunity@tencent.com 删除

javascript