27岁,山西运城人,职业电商经理人,前端开发工作者,从事过网站建设、网络推广、SEO、SEM、信息流推广、二类电商、网络运维、软件开发,等相关电商工作,经验较为丰富,小米技术社区致力于为广大从事Web前端开发的人员提供一些力所能及的引导和帮助 ...[更多]
E-mail:mzze@163.com
Q Q:32362389
W X:xiaomi168527
27岁,山西运城人,职业电商经理人,网络工程师兼运维,从事过运营商网络建设,企业网络建设、优化。数据中心网络维护等通过,经验丰富,座右铭:当自己休息的时候,别忘了别人还在奔跑。 ...[更多]
大于花一样的年龄,河南郑州是我家,2010年在北京接触团购网,2011年进入天猫淘宝一待就是四年,如今已经将设计走向国际化(ps:误打误撞开始进入阿里巴巴国际站的设计,嘿嘿)五年电商设计,丰富经验,从事过天猫淘宝阿里各项设计,店铺运营,产品拍摄;我将我的经历与您分享是我的快乐!座右铭:越努力越幸运! ...[更多]
E-mail:97157726@qq.com
Q Q:97157726
创建对象object的方法很多,那么每种方法都有什么问题呢?
缺点:语句复杂,太多对象无法一一创建
var person = { "name":"张三", "age":"30", "say":function(){ console.log('啊啊啊啊'); } }; var person1 = { "name":"李四", "age":"30", "say":function(){ console.log('啊啊啊啊'); } };
缺点:不太灵活
//封装一个工厂函数,用于生产一个人的对象
function gongchang(n, a){ return { "name":n, "age":a, "say":function(){ console.log('我叫' + this.name); } } var person = gongchang('张三', 30); var person1 = gongchang('李四', 30);
缺点:浪费内存,每次new一个都会创建一个新的函数
function Person(n, a){ //分析过程: 1.首先创建一个空对象 var obj = {}; //2. 将创建的对象,赋给this关键字 this = obj; //3. 将一些属性方法,通过this设置到对象上 //我们只需要直接在构造函数中,使用this 设置成员即可 this.name = n; this.age = a; this.say = function(){ console.log('我叫' + this.name); } //4. 自动将新对象 返回 return this; } var person = new Person('张三', 30); var person1 = new Person('李四', 30);
构造函数特点:函数名称通常首字母大写,不需要写return返回值,使用this设置成员
构造函数相当于类型的概念; 实例化构造函数,得到这个类型下的具体的对象
构造函数创建对象里面方法,每次实例化都是重新定义一个function,浪费内存
缺点:方法非常多时,取名是个问题,容易和一些全局变量冲突
//将构造函数中的方法,单独放在外面定义
var fn = function(){ console.log('我叫' + this.name); }; function Person(n, a){ this.name = n; this.age = a; this.say = fn; } var person1 = new Person('张三', 30); var person2 = new Person('李四', 40); console.log(person1); console.log(person2);
进阶4当方法非常多时,取名是个问题,容易和一些全局变量冲突,我们可以通过加普通对象的方法让其作用域只有对象体内来解决命名的问题
//人的对象 //定义一个公共的字面量对象,存放人的所有对象公共的方法 var obj = { "fn":function(){ console.log('我叫' + this.name); }, "fn2":function(){ console.log('我走的很快'); } }; //构造函数中,给每个人直接定义方法(从公共对象中取) function Person(n, a){ this.name = n; this.age = a; this.say = obj.fn; this.walk = obj.fn2; } //另一类(动物)的对象 var obj2 = { "fn":function(){ console.log('我叫' + this.name); }, "fn2":function(){ console.log('我叫' + this.name); } }; function Dongwu(){ this.name = n; this.age = a; this.say = obj2.fn; }
用系统自带的prototype 原型对象解决构造函数存在的内存问题和命名问题
定义:js给每一个构造函数,都自动分配了一个公共的对象,用来存放这个构造函数实例化后的所有实例对象 公共的成员,这个公共对象就叫做原型对象,可以通过构造函数的prototype属性取到
使用方法:将属性定义在构造函数中,将方法定义到原型对象中
构造函数:
function Person(n,a){ this.name = n; this.age = a; }
原型对象
console.log(Person.prototype); Person.prototype.say = function(){ console.log('我叫' + this.name + ',我今年' + this.age + '岁'); } Person.prototype.walk = function(m, n){ console.log('我走的很快'); // return m+n; }
多次实例化构造函数,得到多个实例对象
var person1 = new Person('张飞', 30); var person2 = new Person('刘备', 40);
//Person构造函数的每一个实例对象,都可以直接使用对应的原型对象上的方法 person1.say(); person1.walk(1,2); person2.say();
所以,创建对象object的时候建议使用方案6,把公共方法区域存在原型对象上,解决构造函数内存和命名的问题.
本站内容均为小米原创,转载请注明出处:小米技术社区>> 创建对象object的6种方法和构造函数创建对象存在的问题,prototype原型对象的引入