JavaScript对象的基本使用方法（与Java的对比）

旧城等待， 2022-11-05 08:40 104阅读 0赞

在面向对象的编程语言中，对象极其重要。不过JavaScript对于对象的操作似乎有一点点不同，但是中心思想仍然是一样的。在此我做个总结。

# 1，基本对象 #

在Java中，创建一个人类，大家都会这样做：

先创建人类：

public class Person {
    
    	private String name;
    
    	private String age;
    
    	private String gender;
    
    	public String getName() {
    		return name;
    	}
    
    	public void setName(String name) {
    		this.name = name;
    	}
    
    	public String getAge() {
    		return age;
    	}
    
    	public void setAge(String age) {
    		this.age = age;
    	}
    
    	public String getGender() {
    		return gender;
    	}
    
    	public void setGender(String gender) {
    		this.gender = gender;
    	}
    
    }

实例化人类对象并使用：

Person person = new Person();
    person.setName("xxx");
    person.setAge("10");
    person.setGender("男");
    // do something...

如果是JavaScript中，等同于：

function Person(name, age, gender) {
    	this.name = name;
    	this.age = age;
    	this.gender = gender;
    }

这其实就是创建了个人类的构造函数，再通过构造函数创建实例：

let person = new Person('出云宫子', 14, '女');
    console.log(person);

这样就创建了个对象。注意，构造函数Person中的this是函数运行时，在函数体内部自动生成的一个对象，只能在函数体内部使用。this就是函数运行时所在的环境对象。

也可以不用构造函数直接创建对象：

let character = {
    	name: '出云宫子',
    	age: 14,
    	gender: '女'
    }

通过对象.属性的方式获取对象属性即可。

# 2，对象的函数 #

Java中，一个类中有属性和函数，其中静态函数直接通过类名.函数名(实参)的方式调用，非静态函数通过该类实例.函数名(实参)的方式调用。

不过在js中没有静态、非静态之分，我们直接在对象中可以把一个属性设定为函数，最后调用即可。

例如：

//创建对象
    let character = {
    	name: '出云宫子',
    	age: 14,
    	gender: '女',
    	say: function () {
    		console.log('hello');
    	}
    }
    //调用对象函数
    character.say();

也可以带参数：

//创建对象
    let character = {
    	name: '出云宫子',
    	age: 14,
    	gender: '女',
    	say: function (msg) {
    		console.log(this.name + '对你说：' + msg);
    	}
    }
    //调用对象函数
    character.say('hello');

也可以使用构造函数：

//构造函数
    function Person(name, age, gender) {
    	this.name = name;
    	this.age = age;
    	this.gender = gender;
    	this.say = function (msg) {
    		console.log(this.name + '对你说：' + msg);
    	}
    }
    
    //创建对象
    let character = new Person('宫子', 14, '女');
    //调用对象函数
    character.say('hello');

可见js中万物皆对象，包括函数。函数也可以视作一个对象的属性，只是调用这个属性时就相当于运行了这个对象的函数。

# 3，js实现抽象类（类似接口） #

Java中有接口和抽象类，通俗地讲，接口和抽象类都可以让我们把一个自定义的函数作为参数并传入对象。

js也可以实现这样的功能，既然函数也是一个对象，我们也可以修改。

//创建对象
    let character = {
    	name: '出云宫子',
    	age: 14,
    	gender: '女',
    	do: null //把该属性作为自定义函数，先留空
    }
    //创建一个函数
    function say(msg) {
    	console.log(msg);
    }
    //设定对象的自定义函数为我们刚刚定义的函数（注意这里say没有带括号，因为函数名就表示函数对象，而函数名()就是执行函数了，两者意义不同）
    character.do = say;
    //执行对象的自定义函数
    character.do('你好.');

也可以和Java8一样使用lambda表达式直接定义匿名函数：

//创建对象
    let character = {
    	name: '出云宫子',
    	age: 14,
    	gender: '女',
    	do: null //把该属性作为自定义函数，先留空
    }
    //通过lambda表达式设定对象的自定义函数
    character.do = (msg) => {
    	console.log(msg);
    };
    //执行对象的自定义函数
    character.do('你好啊');
    
    /**
     * 上述使用lambda表达式定义函数步骤等同于：
     * character.do = function(msg) {
    	console.log(msg);
     * };
     */

同样可以使用构造方法：

//构造函数
    function Person(name, age, gender, doSomething) {
    	this.name = name;
    	this.age = age;
    	this.gender = gender;
    	this.do = doSomething;
    }
    
    //创建对象
    let character = new Person('宫子', 14, '女', (msg) => {
    	console.log(msg);
    });
    //执行对象的自定义函数
    character.do('hi');

lambda表达式不带参数时用() => \{ 函数体 \};表示即可。