js创建对象的多种方式及优缺点
在js中,如果你想输入一个的信息,例如姓名,性别,年龄等,如果你用值类型来存储的话,那么你就必须要声明很多个变量才行,变量声明的多了的话,就会造成变量污染。所以最好的方式就是存储到对象中。下面能我就给大家介绍几种创建对象的方式,并且给大家说一下他们的优缺点
方式一:对象字面量
var obj={
name:"赵云",
type:"突进",
skill:"抢人头"
}
缺点:只能创建一次对象,复用性较差,如果要创建多个对象,代码冗余度太高
方式二:使用内置构造函数
var obj=new Object();
obj.name="李白";
obj.type="刺客";
obj.skill="舞剑";
缺点:只能创建一次对象,复用性较差,如果要创建多个对象,代码冗余度太高
方式三:工厂模式(不推荐使用)
function creat(name,type,skill){
var obj=new Object();
obj.name=name;
obj.type=type;
obj.skill=skill;
obj.say=function(){
console.log("黄河之水天上来");
}
return obj;
}
var hero=creat("李白","刺客","写诗");
var heroNext=creat("赵云","突进","将军");
缺点:对象无法识别,因为所有的实例都指向一个原型
方法四:构造函数模式
function Person(singer,song,type){
//默认吧this传给new出来的对象,并且默认是返回该对象
this.singer=singer;
this.song=song;
this.type=type;
}
var obj=new Person("田馥甄","小幸运","流行歌");
console.log(obj);
注意点:1.如果不写返回值,默认返回的是新创建出来的对象 (一般都不会去写这个return语句)
2.如果我们自己写return语句 return的是空值(return;),或者是基本类型的值或者null,都会默认返回新创建出来的对象
3.如果返回的是object类型的值,将不会返回刚才新创建的对象,取而代之的是return后面的值
优点:实例时可以识别为一个特定的类型
缺点:构造函数中定义函数,那么每次创建对象,都会重新创建该函数,这样会导致全局变量增多,造成污染,代码结构会混乱,不易维护
方法五:原型
function Person(name, age, gender) {
this.name = name;
this.age = age;
this.gender = gender; }
var p =new Person("张学友",18,"male");
var p1 = new Person("刘德华",19,"male");
Person.prototype.sayHello = function () {
console.log("你好我是" + this.name);
}
Person.prototype["sing"] = function () {
console.log("一千个伤心的母牛");
}
p.sayHello();
p1.sayHello();
p.sing();
p1.sing();
优点:说明:构造函数的原型对象中的成员,可以被该构造函数创建出来的所有对象访问,而且,所有的对象共享该对象,所以,我们可以将构造函数中需要创建的函数,放到原型对象中存储,这样就解决 全局变量污染的问题 以及 代码结构混乱的问题
缺点:不能初始化参数
js创建对象的多种方式及优缺点的更多相关文章
- js 创建对象的多种方式
参考: javascript 高级程序设计第三版 工厂模式 12345678910 function (name) { var obj = new Object() obj.name = name o ...
- 基础2:js创建对象的多种方式
js创建对象的多种方式 1. 工厂模式 function createPerson(name) { var o = new Object() 0.name = name return o } var ...
- Javascript深入之创建对象的多种方式以及优缺点
1.工厂模式 function createPerson(name) { var o = new Object(); o.name = name; o.getName = function() { c ...
- HTML中使用js的三种方式及优缺点介绍
1.内部js: 在直接在页面的<script></script>标签内写js代码 优点:相对于使用行内js,内部js代码较为集中,与页面结构的实现代码耦合度较低,比较便于维护 ...
- HTML系列:js和css多种方式实现隔行变色
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- js创建对象的最佳方式
1.对象的定义 ECMAScript中,对象是一个无序属性集,这里的“属性”可以是基本值.对象或者函数 2.数据属性与访问器属性 数据属性即有值的属性,可以设置属性只读.不可删除.不可枚举等等 访问器 ...
- JS字面量创建方式的优缺点
http://www.cnblogs.com/wuyaxing/p/6416441.html
- 【编程题与分析题】Javascript 之继承的多种实现方式和优缺点总结
[!NOTE] 能熟练掌握每种继承方式的手写实现,并知道该继承实现方式的优缺点. 原型链继承 function Parent() { this.name = 'zhangsan'; this.chil ...
- js各种继承方式和优缺点的介绍
js各种继承方式和优缺点的介绍 作者: default 参考网址2 写在前面 本文讲解JavaScript各种继承方式和优缺点. 注意: 跟<JavaScript深入之创建对象>一样,更像 ...
随机推荐
- mysql数据库实操笔记20170418
一.建立商品分类表和价格表: 1.分类表`sankeq``sankeq`CREATE TABLE cs_mysql11(id INT(11) NOT NULL AUTO_INCREMENT,categ ...
- oracle调用array参数存储过程
declare -- Non-scalar parameters require additional processing files tyt_gas2014_search; ,); temp1 t ...
- iOS·UIKit框架注解 & Foundation
- HTML ——Flex弹性布局
弹性盒布局的使用 1.为父容器添加display:flex或inline-flex属性 (Webkit内核的浏览器,必须加上-webkit前缀.) 容器默认存在两根轴:主轴(main axis)和交叉 ...
- 【山东省选2008】郁闷的小J 平衡树Treap
小J是国家图书馆的一位图书管理员,他的工作是管理一个巨大的书架.虽然他很能吃苦耐劳,但是由于这个书架十分巨大,所以他的工作效率总是很低,以致他面临着被解雇的危险,这也正是他所郁闷的.具体说来,书架由N ...
- VS2017使用 SQL Localdb问题两则
VS2017使用 SQL Localdb问题两则 来博客园不算短了,总是索取者.最近使用VS2017,遇到一些问题,在解决时总是找不到拿来就能用的解决方案,在多方寻找,自行探索下,总算圆满解决,在这 ...
- poj1410计算几何线段相交
You are to write a program that has to decide whether a given line segment intersects a given rectan ...
- 一个使用openGL渲染的炫丽Android动画库
android-magic-surface-view 这是一个 android 动画特效库, 可以实现各种炫酷动画. github地址: https://github.com/gplibs/andro ...
- 2017Wow!新媒体营销深度分享会值得参加吗?
"Wow!新媒体营销深度分享会"是虎嗅打造的创新跨界营销平台,以引领营销趋势和洞察技术奇点为目标,推动前沿技术创新与营销的碰撞融合. 在这里,你将看到2017年最前瞻的营销趋势.最 ...
- js修改样式表规则
<div>adasfsfs</div> <div id="div">adasfsfs</div> <div>adasfs ...