JS 如何创建对象?
2021-01-11 11:35:47
浏览数 (2253)
一、new Object();
var x="age"
var obj=new Object();
obj.name="wang";
obj.x=20; //.字符串
obj[x]=25; //[变量]
console.log(obj);//{name: "wang", x: 20, age: 25}
二、字面量
var a="hobby"
var obj={"name":"wang","age":"18"};
obj.sex="男";
obj[a]="唱歌";
obj.say=function(){
}
console.log(obj);//{name: "wang", age: "18", sex: "男", hobby: "唱歌", say: ƒ}
var obj2={"aa bb":"hellow",".x":"world"};
console.log(obj2["aa bb"]);//hellow
console.log( obj2[".x"] );//world
三、工厂模式;
//1.创建函数
function a(name, age) {
var obj = {
"name": "wang",
"age": 19,
"say": function () {
}
}
return obj
}
//2.依次调用
var obj1 = a("wang", 20);
console.log(obj1);//{name: "wang", age: 19, say: ƒ}
console.log(obj1 instanceof Object);//true
//优点:返回新对象,互不影响
//缺点:代码重复(方法相同)。
// 没有从属关系,
四、构造函数
//四、构造函数;
//优点:有从属
//缺点:代码重复(相同方法);
// 1.创建函数
//2.传入参数
function A(name,age){
//3.this。属性名=值
this.name=name;
this.age=age;
this.say=function(){
}
}
//调用 : var obj=new 构造函数(参数)
var obj= new A("wang",19);
console.log(obj);
console.log( obj instanceof Object );//true
console.log( obj instanceof A );//true
五、原型模式
//原型优点:共同/相同的属性、方法不重复 有从属关系
//缺点:原型上的属性不可单独改变
function Fn(){
}
Fn.prototype.name="王";
Fn.prototype.age=19;
var obj=new Fn();
console.log(obj);
/*
修改obj.__proto__.name
obj.__proto__.name 发生变化
obj2.__proto__.name 也发生变化
obj和obj1 共用__proto__对象
公共/相同的属性、方法放在构造函数.prototype上 实现代码不重复
*/
obj.__proto__.name="李"
console.log( obj.__proto__.name );
var obj2=new Fn();
console.log(obj2);
console.log(obj.__proto__.name);
推荐好课:
小白学前端:JavaScript零基础入门到进阶(2020版)