js创建对象和方法

一.直接创建

通过键值对的形式将对象中的属性和方法连接起来

1
2
3
4
5
6
7
var person = {
name : '张三',
age : 18,
sayHi : function () {
alert('hello');
}
}

1、先创建对象,然后添加属性和方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
数组字面量法
<script>
var hotel={}
hotel.name='Quay';
hotel.rooms=40;
hotel.booked=25;
hotel.checkAvilablity=function(){
return this.rooms-this.booked
}
alert(hotel.name)
</script>


对象构造函数法
<script>
var hotel=new Object()
hotel.name='Quay';
hotel.rooms=40;
hotel.booked=25;
hotel.checkAvilablity=function(){
return this.rooms-this.booked
}
alert(hotel.name)
</script>

2、创建对象的同时创建属性和方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
字面量法
<script>
var hotel={
name:'Quay',
rooms:40,
booked:25,
checkAvilablity:function(){
return this.rooms-this.booked
}
}
alert(hotel.name)
</script>

构造函数法
<script>
function Hotel(name,rooms,booked){
this.name=name;
this.rooms=rooms;
this.booked=booked;
this.checkAvilablity=function(){
return this.rooms-this.booked;
}
}

var quayhotel=new Hotel('Quay',40,25);
alert(quayhotel.name);
var parkhotel =new Hotel('Park',120,77);
alert(parkhotel.name);
</script>

二.使用工厂模式创建对象

1
2
3
4
5
6
7
8
9
10
11
12
13
function createPerson (name, age) {
// 创建一个空对象
var per = new Object();
per.name = name;
per.age = age;
per.sayHi = function () {
alert('hello');
}
// 把创建好的对象返回出去
return per;
}
var person1 = createPerson('张三', 18)
var person2 = createPerson('李四', 20)

通过创建一个空对象,在空对象中加入相关属性和属性值,最后记得返回出创建的对象

三.使用构造函数创建对象

1
2
3
4
5
6
7
8
function CreatePerson (name, age) {
this.name = name;
this.age = age;
this.sayHi = function () {
alert('hello');
}
}
var person = new CreatePerson('张三', 18);

四.通过原型创建对象

1
2
3
4
5
6
7
function CreatePerson (name, age) {
this.name = name;
this.age = age;
CreatePerson.prototype.sayHi = function () {
alert('hello');
};
}

此方法就是为了改进对于相同的属性

https://www.jianshu.com/p/01f90948cfe7

创建函数

1
2
3
4
5
6
function myFunction(a,b){
return a+b;
}

//等价于
var myFunction=new Function("a","b","return a+b");
文章作者: kyren
文章链接: http://huluo666.github.io/2018/01/03/js创建对象和方法/
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 Kyren's Blog