博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript创建对象的7种方式及比较
阅读量:5264 次
发布时间:2019-06-14

本文共 2349 字,大约阅读时间需要 7 分钟。

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

function  createObj(name,age,grade){  var obj=new Object();  obj.name=name;  obj.age=age;  obj.grade=grade;  return obj}//调用console.log(createObj('Jessica',13,4));  //{name: "Jessica", age: 13, grade: 4}

2.使用构造函数模式创建

function Person(name,age,grade){  this.name=name;  this.age=age;  this.grade=grade;}//调用var person=new Person('Jessica',13,4);console.log(person) //{name: "Jessica", age: 13, grade: 4}

3.使用原型模式创建

function Person(){}Person.prototype.name="Jessica";Person.prototype.age=13;Person.prototype.grade=4;Person.prototype.frends=['Anna'];Person.prototype.sayName=function () {  alert(this.name);};//调用var person1=new Person();console.log(person1);  //输出{}console.log(person1.name);  //输出"Jessica"console.log(person1.frends.push('Alex'));var person2=new Person();console.log(person2.frends);  //["Anna","Alex"]console.log(person1.hasOwnProperty("name")); //falseperson1.name="Bob";console.log(person1.hasOwnProperty("name")); //true

4.组合使用构造函数模式和原型模式

function Person(name,age,grade){  //构造函数模式用于定义实例属性  this.name=name;  this.age=age;  this.grade=grade;  this.friends=['Anna','Alex'];}Person.prototype={  //原型模式用于定义共享的方法和属性  constructor:Person,  sayName:function(){    console.log(this.name);  }}var person1 = new Person("Nicholas", 15, 5);var person2 = new Person("Greg", 16, 6);person1.friends.push('Jessica');console.log(person1.friends);  //["Anna","Alex","Jessica"];console.log(person2.friends);  //["Anna","Alex"];

5.动态原型模式

function Person(name,age,grade){  this.name=name;  this.age=age;  this.grade=grade;  if(typeof this.sayName!='function'){    Person.prototype.sayName=function(){      console.log(this.name)    }  }}var person= new Person('Jessica',12,4);person.sayName();  //Jessicavar person1= new Person('July',12,4);person1.sayName(); //July

6.寄生构造函数模式

function SpecialArray(){  //创建数组  var values =new Array();  //添加值  values.push.apply(values,arguments);  //添加方法  values.toPipedString=function(){    return this.join("****")  }  return values;}var colors =new SpecialArray('11','22','33');console.log(colors.toPipedString());  //"11****22****33"

7.稳妥构造函数模式

function Person(name,age,grade){  var o =new Object();      o.sayName=function(){    console.log(name);  };  return o;}var friend=Person('Jessica',12,5);friend.sayName();  //Jessica

各种模式的优缺点如下图:

创建obj优缺点比较

转载于:https://www.cnblogs.com/JessicaIsEvolving/p/8601171.html

你可能感兴趣的文章
头插法和尾插法
查看>>
Django web框架篇:基础
查看>>
Exchange超级实用命令行
查看>>
Git
查看>>
面向对象学习
查看>>
C语言中操作符详解
查看>>
Flexbox指南
查看>>
html和body的关系
查看>>
codevs1052 地鼠游戏
查看>>
Codeforces 442B. Andrey and Problem
查看>>
ADS--图像缩放与剪裁(只是完成了前台的功能,传送数据到后台的功能待完成)...
查看>>
android 之HttpURLConnection的post,get方式请求数据
查看>>
密码保护
查看>>
JS解析,格式化日期
查看>>
php json_decode 后,数字转换成了 科学计数法 的解决方案
查看>>
python学习笔记:第9天 函数初步
查看>>
VCenter克隆虚拟机报错msg.snapshot.error-QUIESCINGERROR
查看>>
phonegap3.4.0安装
查看>>
yolov3应该什么时候停止训练?
查看>>
安装Nginx
查看>>