一、通过对象直接量来创建

var emptyt={};  //相当于var empty=new Object;

//如果属性名中包含空格、连字符(-)、还有关键字,保留字时,要用字符串表示

var book={

“main title”:“javascript”,

“sub-title”:“The Definitive Guide”, //属性名包含连字符

“for”:“all audiences”, //属性名包含保留字

author:{

firstname:“David”,

surname:“Flanagan”,

}

}

二、通过new+构造函数创建对象

构造函数可以是js中的内置构造函数和自定义的构造函数

var o=new Object();//创建一个空对象 和{}一样

var a=new Array();//创建一个空数组和[]一样

var d=new Date();//创建一个表示当前时间的对象

var r=new RegExp(‘js’);//创建一个可以进行模式匹配的RegExp对象

三、Object.create()创建对象

Object.creat()是一个静态函数,不是提供给某个对象调用的方法,使用时,需要传递原型对象(及要继承的对象),第二个参数可选,用以对对象的属性进行进一步描述。

var o1=Object.create({x:1,y:2});  //o1继承了属性x和y

可以通过传入参数null创建一个没有原型对象的新对象,通过这种方式创建的对象不继承任何东西

var o2=Object.create(null);//o2不继承任何属性和方法

如果想创建一个普通的空对象(比如通过{ }或者new Object()创建的对象);需要传入Object.prototype;

var  o3=Object.create(Object.prototype);  //o3和{}、new Object一样

工厂模式

工厂模式非常直观,将创建对象的过程抽象为一个函数,用函数封装以特定接口创建对象的细节,通俗的讲,工厂模式就是将创建对象的语句放在一个函数里面,通过传入参数来创建特定对象,最后返回创建的对象,工厂模式虽然可以创建多个相似的对象,但是不能解决对象标识的问题,即知道一个对象的类型。

function createStudent(name,sex,grade)

{

var o=new Object( );

o.name=name;

o.sex=sex;

o.grade=grade;

o.sayName=function()

{

console.log(this.name)

}

return o;

}

var s1=createStudent(“david”,“女”,“15”);

五、构造函数模式

像Object和Array这样的原生构造函数,在运行时会自动出现在执行环境。此外,也可以创建自定义的构造函数,从而定义自定义对象类型的属性和方法。

function Student(name,sex,grade)

{

this.name=name;

this.sex=sex;

this.grade=grade;

this.sayName=function()

{

console.log(this.name);

}

}

var s1=new Student(“we”,“女”,“17”);

注意构造函数的首写字母必须大写,以便与普通函数区分开来。

此外要注意,要创建Student的实例,必须使用new操作符,创建的实例对象将有一个constructor(构造器属性),指向Person构造函数。

调用构造函数创建对象主要经历了下面几个步骤:

1、创建一个新对象;

2、把构造函数的作用域赋给新的对象(因此this就是指向新的对象实例);

3、执行构造函数中的代码;

4、返回新对象;

构赞函数的缺点:

每个方法都要在每个实例上面创建一遍,函数即是对象,因此每定义一个函数,也就实例化了一个对象。所以调用同一个构造函数所创建的不同实例对象中的方法是不相等的。

var s3 = new Student('唐僧','male',3);

var s4 = new Student('白骨精','female',4);

s3.sayName();

s4.sayName();

console.log(s3.sayName == s4.sayName);  //结果为false 所以两个方法是两个不同的方法

六、原型模式

js中,每个对象都有一个prototype属性,原型对象,原型对象包含了可以由特定类型的所有实例对象的共享的属性和方法。

使用原型模型可以让所有的实例对象共享原型对象中的属性和方法。

function Student_1(){

}

Student_1.prototype={

name:“wangyue”,

sex:“女”,

class:5,

sayName:function()

{

console.log(this.name)

}

}

var s1=new Student_1();

var s2=new Student_2();

console.log(s1.sayName==s2.sayName);

了解原型后可以继续在实例对象上面添加属性和方法;

s1.name=“john”;

console.log(s1.name);打印出来是john;

当要读取某个对象的属性时,都会执行一次搜索,搜索首先从对象实例本身开始,如果在实例中找到了这个属性,则搜索结束,返回实例属性的值;若实例上没有找到,则继续向对象的原型对象延伸,搜索对象的原型对象,若在原型对象上找到了,则返回原型上相应属性的值,若没有找到,则返回undefined。因此,实例对象属性会覆盖原型对象上的同名属性,所以上面第二行代码输出的是John。

Object.getPrototypeOf(object)方法返回参数对象的原型对象。

Object.keys(object)方法返回对象上可枚举的实例属性。

Student_1.prototype.friends = ['aa','bb'];

console.log('s6的朋友' + s6.friends);

s5.friends.push('cc');

console.log('s5的朋友' + s5.friends);

console.log('s6的朋友' + s6.friends);

问题来了,我们只想改变s5的朋友列表,但由于原型模式的共享本质,s6的朋友列表也随之改变了。因此,很少单独使用原型模式。

七、组合使用构造函数和原型模式

构造函数模式用于定义实例属性,原型模式则用于定义方法和共享的属性。这种混合模式不仅支持向构造函数传入参数,还最大限度地节约了内存,可谓是集两模式之长。示例代码如下:

function Student(name,sex,grade){

this.name = name;

this.sex = sex;

this.grade = grade;

}

Student.prototype.sayName = function(){

console.log(this.name);

}

Student.prototype.school = 'Joooh school';

除了以上几种常见的模式外,批量创建对象的方式还有

动态原型模式:仅在第一次调用构造函数时,将方法赋给原型对象的相应属性,其他示例的处理方式同构造函数模式

寄生构造函数模式:仅仅封装创建对象的代码,然后再返回新创建的对象,仍使用new操作符调用

稳妥构造函数模式:没有公共属性,只有私有变量和方法,以及一些get/set方法,用以处理私有变量。

js对象的创建的更多相关文章

  1. js 对象的创建方式和对象的区别

    js一个有三种方法创建对象,这里做一个总结. 1.对象直接量 所谓对象直接量,可以看做是一副映射表,这个方法也是最直接的一个方法,个人比较建议, 1 2 3 4 5 6 7 8 9 10 11 12 ...

  2. js对象的创建与原型总结

    //1 新建对象 var box = new Object(); box.name = "lee"; box.age = 100; box.run = function(){ re ...

  3. js对象的创建模式

    方式一: Object构造函数模式 * 套路: 先创建空Object对象, 再动态添加属性/方法 * 适用场景: 起始时不确定对象内部数据 * 问题: 语句太多 /* 一个人: name:" ...

  4. JS对象的创建与使用

    本文内容:     1.介绍对象的两种类型:     2.创建对象并添加成员:     3.访问对象属性:     4.利用for循环枚举对象的属性类型:     5.利用关键字delete删除对象成 ...

  5. js对象的几种创建方式和js实现继承的方式[转]

    一.js对象的创建方式 1. 使用Object构造函数来创建一个对象,下面代码创建了一个person对象,并用两种方式打印出了Name的属性值. var person = new Object(); ...

  6. JS对象与PHP对象的对比

    一.对象的创建与访问 1.JS对象的创建与访问 //方式一(通过内置构造函数创建后添加属性) var obj = new Object(); obj.name = 'Lucy'; //通过点添加属性 ...

  7. javascript基础-js对象

    一.js对象的创建 1.普通最简单的方式 var teacher = new Object( ); teacher.name = "zhangsan"; teacher.age = ...

  8. 浅谈Js对象的概念、创建、调用、删除、修改!

    一.我们经常困惑,对象究竟是什么,其实这是一种思维,一种意识上的东西,就像我们都说    世界是有物质组成的道理一样,理解了下面的几句话!对象也不是那么抽象!    1.javascript中的所有事 ...

  9. js中对象的创建

    json方式,构造函数方式,Object方式,属性的删除和对象的销毁 <html> <head> <title>js中的对象的创建</title> &l ...

随机推荐

  1. Matlab_spectrogram_短时傅里叶分析_实现与讨论

    在语音与音乐处理过程中,常用到短时傅里叶变换(Short Time Fourier Transformation, STFT).在一些学习路径中,STFT也是学习小波之前的预备知识.本文简单实现了 M ...

  2. Python环境搭建遇到问题及解决方案记录

    pip版本问题 环境使用Ubuntu16.04 , 安装pip3 $sudo apt-get install python3-pip 默认安装pip8.1.1,更新后是18.1 $pip3 insta ...

  3. 自动化测试-17.selenium数据的分离之txt文本的写入与读取

    前言 数据量偏小时,用txt文本保存数据比较合适,以-进行区分,为什么不用:呢?原因是,我们在使用数据时,会存在url地址的情况,里面宝行:所以用-进行替代 此处附上代码 #encoding=utf- ...

  4. SQL字符串处理!

    一.字符转换函数1.ASCII()返回字符表达式最左端字符的ASCII 码值.在ASCII()函数中,纯数字的字符串可不用‘’括起来,但含其它字符的字符串必须用‘’括起来使用,否则会出错. 2.CHA ...

  5. javascript中的Date对象

    Date是什么? Date是日期类的构造函数 也是个对象,用于构造日期对象的实例. 有一个 now()方法,返回截止目前的时间戳(1970.1.1日始). Date.parse()接受 一定格式的日期 ...

  6. IntelliJ IDEA 2018 破解过程[详细步骤](Mac OS & Windows)

    注册码获取地址:http://idea.lanyus.com/ 1.软件下载 首先进入https://www.jetbrains.com官网进行下载. 2.下载破解包 可百度搜索JetbrainsCr ...

  7. Failed to load ApplicationContext ,Error creating bean with name 'adminUserService': Injection of autowired dependencies failed;

    Druid配置的时候出现这个问题: "C:\Program Files\Java\jdk1.8.0_191\bin\java" -ea -Didea.test.cyclic.buf ...

  8. 【EMV L2】EMV终端数据

    Account TypeAcquirer IdentifierAdditional Terminal CapabilitiesAmount, Authorised (Binary)Amount, Au ...

  9. AI之旅(7):神经网络之反向传播

    前置知识   求导 知识地图   神经网络算法是通过前向传播求代价,反向传播求梯度.在上一篇中介绍了神经网络的组织结构,逻辑关系和代价函数.本篇将介绍如何求代价函数的偏导数(梯度). 梯度检测   在 ...

  10. 关于html引用php文件在编译器正常运行,web浏览器出问题的一点心得

    首先上图 第一张图是预期效果,也就是编译器运行的效果,第二张则是在浏览器打开的效果.那么为甚么会出现这何种问题呢? 原来:编译器能正常运行 是因为是走的cli模式,而浏览器现在走的是web模式,php ...