JavaScript基础知识 第三篇 Object

Object

 

1.object创建

 

在JavaScript中，对象object就是一组引用reference的集合。可以直接创建一个，例如：

 

var obj = {
    name： 'Jack',
    height: 178
}; //这就是一个对象啦

 

如果想要习创建大量相似的对象，就需要一个类似模板的东西来完成这个任务。如果是使用Java等语言的同学知道这个模板就是 ”类“ （class），在JavaScript中没有class的概念，一个新对象是由一个prototype对象直接复制出来的。而构造函数在JavaScript中可以是任何函数，通常首字母大写来表示该函数用作构造函数。

 

2.构造函数、this和prototype

 

下面给出构造函数的写法，例如：

 

function User( name ) {
    this.name = name;//this 指向新创建的对象
    this.sayName = function() {
        alert( this.name );
    }
}

var user = new User('Jack');

user.sayName(); //'Jack';

 

注意到构造函数中的this关键字，this关键字在JavaScript中非常灵活，在构造函数中this指向新创建的对象。所以新创建的对象user的name属性被赋值为'Jack'，sayName为一个函数。

考虑这个问题，每个user有一个自己的name没有问题，但是都拥有一个sayName属性是这种无状态的函数，是对内存的极大浪费，那我们要把这类通用的属性放在哪里呢，就是下面要介绍的prototype了。我们把sayName放到prototype上：

 

 function User(name) {
        this.name = name;
    }

    User.prototype.sayName = function () {
        return this.name;
    }

    var user = new User('Jack');
    var user1 = new User('Hello');
    alert(user.sayName()); // 'Jack'
    alert(user1.sayName());// 'Hello'
    alert(user.sayName === user1.sayName);//true

 

 这样user和user1的sayName就是同一个函数了。

 

3.继承

 

那如何实现其他语言中的继承呢，JavaScript是通过原型链实现的（prototype chain），例如：

 function User(name) {
        this.name = name;
    }

    User.prototype.sayName = function () {
        return this.name;
    }

    function MaleUser(name) {
        this.name = name;
        this.gender = 'male';
    }

    MaleUser.prototype = new User();
    
    var maleUser = new maleUser('Jack');
    alert(maleUser.sayName());  //'Jack'

 

注意MaleUser.prototype = new User();这行代码就是将User实例复制给MaleUser.prototype，这样就形成了原型链，sayName属性在MaleUser的原型上找不到，就到User的原型上去找。如果还找不到就一直找到Object的原型。最后，JavaScript是一门面向对象的语言，我们将在很多地方看到对象的身影。

 

小结：本文介绍了JavaScript的基础知识，由于JavaScript的写法比较灵活，想要看比较好的JavaScript class的实现？请移步这里。

 

小作业：去看看class的历史吧，亲~