js对象的创建
一、通过对象直接量来创建
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对象的创建的更多相关文章
- js 对象的创建方式和对象的区别
js一个有三种方法创建对象,这里做一个总结. 1.对象直接量 所谓对象直接量,可以看做是一副映射表,这个方法也是最直接的一个方法,个人比较建议, 1 2 3 4 5 6 7 8 9 10 11 12 ...
- js对象的创建与原型总结
//1 新建对象 var box = new Object(); box.name = "lee"; box.age = 100; box.run = function(){ re ...
- js对象的创建模式
方式一: Object构造函数模式 * 套路: 先创建空Object对象, 再动态添加属性/方法 * 适用场景: 起始时不确定对象内部数据 * 问题: 语句太多 /* 一个人: name:" ...
- JS对象的创建与使用
本文内容: 1.介绍对象的两种类型: 2.创建对象并添加成员: 3.访问对象属性: 4.利用for循环枚举对象的属性类型: 5.利用关键字delete删除对象成 ...
- js对象的几种创建方式和js实现继承的方式[转]
一.js对象的创建方式 1. 使用Object构造函数来创建一个对象,下面代码创建了一个person对象,并用两种方式打印出了Name的属性值. var person = new Object(); ...
- JS对象与PHP对象的对比
一.对象的创建与访问 1.JS对象的创建与访问 //方式一(通过内置构造函数创建后添加属性) var obj = new Object(); obj.name = 'Lucy'; //通过点添加属性 ...
- javascript基础-js对象
一.js对象的创建 1.普通最简单的方式 var teacher = new Object( ); teacher.name = "zhangsan"; teacher.age = ...
- 浅谈Js对象的概念、创建、调用、删除、修改!
一.我们经常困惑,对象究竟是什么,其实这是一种思维,一种意识上的东西,就像我们都说 世界是有物质组成的道理一样,理解了下面的几句话!对象也不是那么抽象! 1.javascript中的所有事 ...
- js中对象的创建
json方式,构造函数方式,Object方式,属性的删除和对象的销毁 <html> <head> <title>js中的对象的创建</title> &l ...
随机推荐
- [转] CMake
转载地址:https://www.cnblogs.com/lidabo/p/7359422.html cmake 简介 CMake是一个跨平台的安装(编译)工具,可以用简单的语句来描述所有平台的安装( ...
- 神州数码NAT地址转换配置
实验要求:熟练掌握NAT地址转换的配置方法 拓扑如下 R1 enable 进入特权模式 config 进入全局模式 hostname R1 修改名称 interface s0/1 进入端口 ip ad ...
- python学习笔记——(一)基础设置
python的学习,今天就开始上开发环境Pycharm,这样以后在调试,使用和学习起来就方便很多. 我用的是JetBrains PyCharm Community Edition 2018.1.1 x ...
- jQuery-4.动画篇---淡入淡出效果
jQuery中淡出动画fadeOut 让元素在页面不可见,常用的办法就是通过设置样式的display:none.除此之外还可以一些类似的办法可以达到这个目的.这里要提一个透明度的方法,设置元素透明度为 ...
- 打印sql
$query=$sql->where([ 'test_id'=>24, 'name'=>'小洋' ]); //打印sql; $query->prepare(Yii::$app- ...
- 商品规格,自定义SKU类型
<html> <head> <script type="text/javascript" src="http://xoxco.com/exa ...
- c#枚举描述
1.枚举遍历 public enum e_Sex{ male=, female= } foreach (var value in Enum.GetValues(typeof(e_Sex)){ /* 获 ...
- pycharm的快捷键
一.编辑(Editing) Ctrl+Space 基本的代码完成(类.方法.属性) Ctrl+Alt+Space 快速导入任意类 Ctrl+Shift+Enter 语句完成 Ctrl+P 参数信息(在 ...
- Python基础:七、注释
有时候我们写的东西不一定都是给用户看的,或者不希望解释器执行(方便自己,方便他人),我们可以使用#来注释掉代码被注释的内容是不会执行的,可以方便后面的程序员来拜读你的代码. 1. 单行注释:#被注释的 ...
- centos7进单用户
当重启linux系统,进入系统选择页面的时候,按e 在linux16那一行最后面添加 init=/bin/sh 按ctrl+c 挂载根分区,可读写 mount / -o rw, remount