对象是什么

从JavaScript定义上讲对象是无序属性的集合,其属性可以包含基本值、对象或函数。也就是说对象是一组没有特定顺序的属性,每个属性会映射到一个值上,是一组键值对,值可以是数据或对象。

最简单的对象

JavaScript的一对花括号{}就可以定义一个对象,这样的写法实际上和调用Object的构造函数一样

var obj={};
var obj2=new Object();

  

这样构建出来的对象仅仅包含一个指向Object的prototype的指针,可以使用一些valueOf、hasQwnProperty等方法,没有多大实际作用,自定义对象嘛总要有一些自定义的属性、方法神马的。

var obj={};
obj.a=0;
obj.fn=function(){
alert(this);
} var obj2={
a:0,
fn:function(){
alert(this);
}
}

  

可以在定义完对象后通过”.”为其添加属性和方法,也可以使用字面量赋值方法在定义对象的时候为其添加属性和方法,这样创建的对象,其方法和属性可以直接使用对象引用,类似于类的静态变量和静态函数,这样创建对象有一个明显缺陷——在定义大量对象的时候很费力,要一遍遍的写几乎是重复的代码。

抽象一下

既然是重复代码就可以抽象出来,用函数来做这些重复工作,在创建对象的时候调用一个专门创建对象的方法,对于不同的属性值只需要传入不同参数即可。

function createObj(a,fn){
var obj={};
obj.a=a;
obj.fn=fn;
return obj;
} var obj=createObj(2,function(){
alert(this.a);
});

  

这里先定义o为一个空的对象,然后为o设置了一堆属性。其实也可以直接给o属性的嘛,所以如果这样写也是ok的。

function createPerson(name,age,job){
var o = {};
o.name = name;
o.age = age;
o.job = job;
o.sayName = function(){
alert(this.name);
};
return o;
} var tanya = createPerson("tanya","30","female");
var ansel = createPerson("ansel","30","male"); tanya.sayName();
ansel.sayName();

  还有一种办法是利用无敌的this,因为this就表示当前运行时的对象,将构造函数this的作用域指向新对象,将当前运行对象的属性和方法都赋给新对象,这样对象模式称为构造函数模式

function Person(name,age,job){
this.name = name;
this.age = age;
this.job = job;
this.sayName = function(){
alert(this.name);
};
} var tanya = new Person("tanya","30","female");
var ansel = new Person("ansel","30","male"); tanya.sayName();
ansel.sayName();

  

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

  1. anjular中Service、Factory、Provider的使用与js中创建对象的总结

    在学习anjular中Service的使用时,发现和js中的创建对象的方式有一定的联系,所以总结了anjular中Service.Factory.Provider的使用方式与js创建对象的方式 一.先 ...

  2. JS中创建对象的方法及json

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  3. js中创建对象的几种方式

    创建对象指创建一个object并给这个对象添加属性和方法,有以下几个方式: 最基本的: var Person={}; Person.name='tom'; Person.age='20'; Perso ...

  4. js中创建对象的三种方式

    1. 对象字面量 var obj={ name:"小小", age:3, car:{ brand:"baoma", } }; } 2.使用内置构造函数 var ...

  5. 比较js中创建对象的几种方式

    1.工厂模式 function createObj(name, sex){ var obj = new Object(); obj.name = name; obj.sex = sex; obj.sa ...

  6. js中创建对象的4种方法

    1.直接创建,不可复用式创建var obj = new Object(); obj.name = ""; obj.id = ""; 2.使用工厂方法来创建对象, ...

  7. js中创建对象

    https://www.cnblogs.com/starof/p/4162354.html

  8. js中创建对象的5种方法

    1.原始模式 var dog = { name: jack, length: 70, wang:function(){ console.log(this.name); } 2.工厂模式(批量) fun ...

  9. Day046--JavaScript-- DOM操作, js中的面向对象, 定时

    一. DOM的操作(创建,追加,删除) parentNode 获取父级标签 nextElementSibling 获取下一个兄弟节点 children 获取所有的子标签 <!DOCTYPEhtm ...

随机推荐

  1. Attribute的理解和认识

    1什么是Attribute? 在网上看到这样一段定义 MADN的定义为:公共语言运行时允许添加类似关键字的描述声明,叫做attributes, 它对程序中的元素进行标注,如类型.字段.方法和属性等.A ...

  2. CSU 1812 三角形和矩形

    湖南省第十二届大学生计算机程序设计竞赛$J$题 计算几何. #pragma comment(linker, "/STACK:1024000000,1024000000") #inc ...

  3. vb.net 结束进程

    Public Class Form1 Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click ...

  4. table表头thead固定

    <html> <head> <meta charset="utf-8"/> <script type="text/javascr ...

  5. [UWP小白日记-3]记账项目-1

    学了一段时间的UWP,来个项目试试手. 本来是想边做边学MVVMLight的结果感觉MVVM对于萌新来说太高难,以后再把这个项目改造成MVVMLight框架的项目. 下面进入正题. 中间那快空白打算放 ...

  6. 【锋利的Jquery】读书笔记三

    DOM操作 三个方面;DOM core    html-dom  css-dom 注意点: 删除事件中 三种删除节点的方法   remove   detach   empty remove不解释 de ...

  7. wvs_patcher批量测试网站

    来自:http://zone.wooyun.org/content/23162 pip install multiprocessing错误. 然后就到官方下载安装包本地安装 multiprocessi ...

  8. HTML中判断手机是否安装某APP,跳转或下载该应用

    有些时候在做前端输出的时候,需要和app的做些对接工作.就是在手机浏览器中下载某app时,能判断该用户是否安装了该应用.如果安装了该应用,就直接打开该应用:如果没有安装该应用,就下载该应用.那么下面就 ...

  9. 学习node的REPL

    REPL: read eval print loop 支持 多行代码 编辑模式,即 识别{} () 为代码块. 在repl中快速查看 对象的属性 gl = global repl command .h ...

  10. Date对象 识记

    1.Date 对象创建 var myDate=new Date() 2.Date 对象属性 constructor pototype 3.Date 对象方法 Date()               ...