JS中一切皆为对象,这是一句常说的话。了解JS对象,从这句话开始吧。JS中的基本数据类型如number,bool,字符串,数组,null,undefined等等都是对象。

对象的本质:

带有属性和方法的特殊数据类型,而每个属性或者方法又可看做是一个键值对,因此可以这样定义:对象是一系列无序键值对的集合

在JS中对象分为两种:

  • JS的内建对象,如:string,Date,Array等
  • 你自己创建的对象

JS中如何创建自己的对象:

1 对象初始化器,这种方式最为简单暴力,直接一系列明显的键值对集合。

    var obj={
name:'PengL',
age:100,
func:function()
{
alert("I am "+obj.name+" and I am "+obj.age);
}
};

2 构造函数

    function person(name,age){
this.name=name;
this.age=age;
this.func=func;
function func()
{
alert("I am "+this.name+" and I am "+this.age);
}
}
var obj=new person("PengL",100);

说明:第一种方法是直接创建的一个对象的实例,第二种是通过new构造函数的方式来创建一个对象,并且传入不同的参数,这样对象对应的属性值就不一样。不过要注意的是不要忘了new,不然就是把一个普通函数赋给了obj,并且这时的this指向也是混乱的了。关于this指向的问题可以参考一下作者的另一篇博客javascript进阶之this

对于构造函数创建对象的方法我还想再进一步介绍一下

一般在真实的项目中上面demo的写法其实是不合理的。最好的方式是原型和构造函数混用的方式来做,比如上面的可以改成这样

    function person(name,age)
{
this.name=name;
this.age=age;
}
person.prototype.func=function(){
alert("I am "+this.name+" and I am "+this.age);
};

这种方式不仅结构清楚,最重要的是还节约了内存,在对象的原型上创建的方法,那么这个方法就是通过该构造函数所创建的所有对象共有的方法了。各个对象有自己独有的name,age属性,有共有的func方法。如果有对原型不熟悉的同学可以看看这篇廖雪峰大神的作品廖雪峰


最后再做一下总结吧,加深一下印象

  • JS中一切皆对象
  • 对象本质是一系列无序键值对的集合
  • 创建对象有两种常见的方法,初始化器和构造函数(不同情况来进行选择,并非总是第二种最好)

JS基础之对象的更多相关文章

  1. JS基础学习——对象

    JS基础学习--对象 什么是对象 对象object是JS的一种基本数据类型,除此之外还包括的基本数据类型有string.number.boolean.null.undefined.与其他数据类型不同的 ...

  2. JS基础语法---对象总结

        * 编程思想:     * 面向过程:凡事亲力亲为,所有的事情的过程都要清楚,注重的是过程     * 面向对象:提出需求,找到对象,对象解决这个问题,我们要结果,注重的是结果     *   ...

  3. JS基础_对象的简介、对象的基本操作

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

  4. 【JS基础】对象

    delete 可以删除对象属性及变量 function fun(){ this.name = 'mm'; } var obj = new fun(); console.log(obj.name);// ...

  5. js基础-单体对象日期对象

    Math对象 全局对象 日期对象 var t = new Date() t.toLocaleDateString(); t.getFullYear(); t.getMonth() + 1 t.getD ...

  6. 2-4 js基础-事件对象小结

    var e=ev||event; e.cancelBubble=true; document.documentElement   html document.body                  ...

  7. JS基础_对象的方法

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

  8. JS基础_对象字面量

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

  9. JS基础_对象操作

    1.in 运算符 通过该运算符可以检查一个对象中是否含有指定的属性,如果有,返回true 语法: “属性名” in 对象 var obj = { name:"hello" } co ...

随机推荐

  1. Python黑帽编程1.1虚拟机安装和配置 Kali Linux 2016

    Python黑帽编程1.1虚拟机安装和配置 Kali Linux 2016 0.1  本系列教程说明 本系列教程,采用的大纲母本为<Understanding Network Hacks Att ...

  2. MySQL 复制表结构

    200 ? "200px" : this.width)!important;} --> 介绍 有时候我们需要原封不动的复制一张表的表结构来生成一张新表,MYSQL提供了两种便 ...

  3. Getting&Giving

    Technologies: Want to know: 1 emergency 1: 现在的工作即将需要的.要用到的技术 2 emergency 2: 现在的工作不相关.但公司相关的的技术 3 eme ...

  4. [Hadoop大数据]——Hive部署入门教程

    Hive是为了解决hadoop中mapreduce编写困难,提供给熟悉sql的人使用的.只要你对SQL有一定的了解,就能通过Hive写出mapreduce的程序,而不需要去学习hadoop中的api. ...

  5. Gitcafe绑定自定义域名

    之前将自己练习写作工具替换为Markdown,部署工具改为Hexo,并且将托管地搬家到GitCafe之后,便是被各种的舒爽所围绕.具体折腾的详情参见使用Hexo搭建专属Blog.她们的组合方便快捷,让 ...

  6. Atitit 深入理解抽象类与接口 attilax总结

    Atitit 深入理解抽象类与接口 attilax总结 1.1. 主要区别接口侧重于动作抽象..抽象类是属性名词抽象..1 1.2. 抽象层次类>>抽象类>>接口1 1.3. ...

  7. 考勤系统——代码分析datagrid

    datagrid是easyui的控件,DataGrid以表格形式展示数据,并提供了丰富的选择.排序.分组和编辑数据的功能支持.DataGrid的设计用于缩短开发时间,并且使开发人员不需要具备特定的知识 ...

  8. c#属性中的get和set属性

    get是给属性赋值,set是取属性的值. get.set用法: 一是隐藏组件或类内部的真是成员: 二是用来建立约束的,比如,实现“有我没你”这种约束: 三是用来响应属性变化事件,当属性变化是做某事,只 ...

  9. A Simple OpenGL Shader Example

    A Simple OpenGL Shader Example eryar@163.com Abstract. OpenGL Shading Language, the high-level progr ...

  10. Undo/Redo for Qt Tree Model

    Undo/Redo for Qt Tree Model eryar@163.com Abstract. Qt contains a set of item view classes that use ...