javascript之对象


学习要点:

  对象的属性和方法

  对象的原型

一、对象

  对象其实就是一种引用类型,而对象的值就是引用对象的实例。

二、创建对象

  在javascript中有两种对象,一种是系统内置对象,另一种是用户自己创建的对象。

  1、使用构造函数创建内置对象

  在javascript中有很多内置的对象,每个内置的对象都有一个构造函数,直接使用构造函数就可以创建并初始化一个对象。

  在javascript中可以使用new运算符来调用构造函数创建对象。如:var myObject=new Object();

  2.直接创建自定义对象

  var 对象名={属性名1:值1,属性名2:值2,...}

  var pen={name:"钢笔“,color:"红色”,price:30}

  3.使用自定义构造函数创建对象

function pen(name,color,price)
{
this.name=name;
this.color=color;
this.price=price;
}
var pen1=new pen("铅笔“,”红色",30);

三、对象的属性

  设置对象的属性有3中方法

  1、在创建对象时同时设置对象的属性。var pen={name:"钢笔",color:"红色",price:30}

  2、在创建对象的构造函数时设置对象的属性。

  3、先创建一个空对象,再设置对象属性。

var pen=new Object();
pen.name="铅笔";pen.color="红色",pen.price=30;

  属性的获取:变量名=对象名.属性名

   属性的赋值:对象名.属性名=属性值

   属性的枚举:for...in语句枚举对象的所有属性

   属性的删除:delete pen1.name;

四、构造函数

  创建构造函数的方法与创建普通函数的方法一样,都是使用function语句。

function pen(name,color,price)
{
this.name=name;
this.color=color;
this.price=price;
}

五、对象的原型

  对象的原型:在javascript中,原型对象是由构造函数所定义的,若果要修改对象的原型,就必须要修改构造函数的原型对象的成员。因此,在jacascript中所有函数都有一个prototype属性,该属性可以引用一个原型对象。通过该属性,可以修改原型对象中的属性。

   构造函数实例属性和原型属性示意图

function pen(color,price)
{ this.color=color;
this.price=price;
}
pen.prototype.name="铅笔";
var pen1=new pen(”红色",30);
document.write(pen1.name+"<br>");//铅笔
document.write(pen1.constructor.prototype.name+"<br>");//铅笔

虽然没有直接将name属性赋给pen1对象,但该对象还是拥有name属性。事实上,引用pen1.name属性时,就是引用了pen1.constructor.prototype.name的属性,constructor用于返回对象的构造函数。

function pen(color,price)
{ this.color=color;
this.price=price;
}
var pen1=new pen(”红色",30);
pen1.name="铅笔";
document.write(pen1.name+"<br>");//铅笔
document.write(pen1.constructor.prototype.name+"<br>");//undefined

虽然在原型对象中并没有name的属性,但是可以为pen1对象设置那么属性值,即使pen1对象设置了属性值,原型对象中也不会添加name属性。


javascript基础学习(六)的更多相关文章

  1. JavaScript基础学习(六)—函数

    一.函数的定义 1.function语句形式 //1.function语句式 function test1(){ alert("I am test1"); } test1(); 2 ...

  2. JavaScript 基础学习1-day14

    JavaScript 基础学习1 知识预览JavaScript概述二 JavaScript的基础三 JavaScript的对象BOM对象DOM对象实例练习js扩展 JavaScript概述 JavaS ...

  3. 48.javascript基础学习

    javascript基础学习:   http://www.w3school.com.cn/jsref/index.asp jS的引入方式: 1.行间事件:为某一个具体的元素标签赋予js内容,oncli ...

  4. JavaScript 基础学习(二)js 和 html 的结合方式

    第一种 使用一个标签 <script type="text/javascript"> js代码; </script> 第二种 使用 script 标签,引入 ...

  5. JavaScript 基础 学习 (四)

    JavaScript 基础 学习 (四) 解绑事件 dom级 事件解绑 ​ 元素.on事件类型 = null ​ 因为赋值的关系,所以给事件赋值为 null 的时候 ​ 事件触发的时候,就没有事件处理 ...

  6. JavaScript 基础 学习(三)

    JavaScript 基础 学习(三) 事件三要素 ​ 1.事件源: 绑定在谁身上的事件(和谁约定好) ​ 2.事件类型: 绑定一个什么事件 ​ 3.事件处理函数: 当行为发生的时候,要执行哪一个函数 ...

  7. JavaScript 基础 学习 (二)

    JavaScript 基础 学习 节点属性 ​ 每一个节点都有自己的特点 ​ 这个节点属性就记录着属于自己节点的特点 1. nodeType(以一个数字来表示这个节点类型) ​ 语法:节点.nodeT ...

  8. JavaScript 基础 学习 (一)

    JavaScript 基础 学习 获取页面中的元素的方法 作用:通过各种方式获取页面中的元素 ​ 比如:id,类名,标签名,选择器 的方式来获取元素 ​ 伪数组: ​ 长的和数组差不多,也是按照索引排 ...

  9. 回归JavaScript基础(六)

    主题:引用类型Date.RegExp的介绍. 上节主要主要介绍了Object.Array引用类型.这节将继续为大家介绍引用类型,并对书中的一些知识点进行总结与归纳,也借此巩固自己对JavaScript ...

  10. 几张非常有意义的JavaScript基础学习思维图

    分享几张对于学习JavaScript基础知识非常有意义的图,无论你的JavaScript级别如何,“温故而知新”完全可以从这些图中得到. 推荐理由:归类非常好,非常全面 JavaScript 数组 J ...

随机推荐

  1. 【HDOJ】2386 Dart Challenge

    纯粹母函数+滚动数组,水之. /* 2386 */ #include <iostream> #include <string> #include <map> #in ...

  2. 原生javascript难点总结(1)---面向对象分析以及带来的思考

    ------*本文默认读者已有面向对象语言(OOP)的基础*------ 我们都知道在面向对象语言有三个基本特征 :  封装 ,继承 ,多态.而js初学者一般会觉得js同其他类C语言一样,有类似于Cl ...

  3. git bash【初级入门篇】

    最近公司打算使用git代替之前的svn版本控制工具,趁此机会打算好好学学git,这个号称当今世界最牛的分布式版本控制工具. 一.[git和svn的主要区别] 1.去中心化 svn以及微软的TFS均采用 ...

  4. 解压华为P6 UPDATE.APP

    #!/usr/bin/env python # Version: 0.2.201308040830 # Author: linkscue # Function: unpack any hauwei h ...

  5. 高性能I/O设计模式Reactor和Proactor

    系统I/O 可分为阻塞型, 非阻塞同步型,非阻塞异步型. (Linux对aio支持的不完整,所以linux上用Reactor比较多:Proactor需要系统API支持真正的“异步”) 阻塞型I/O意味 ...

  6. 【Android - 进阶】之代码打包签名与混淆

    代码打包签名 Android Studio为大家集成了代码打包混淆的功能,具体操作流程如下组图所示: 1.点击Android Studio上方工具栏的  Build -> Generate Si ...

  7. hdu 2546 饭卡(DP)

    很久以前做过这道题,晚上睡不着,看见nyist加了一个DP的比赛,就进来打个酱油. 这道题的点睛之笔是将最大值记录下来,然后将其值改为0.之后就是普通的背包了. #include<stdio.h ...

  8. 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(34)-文章发布系统①-简要分析

    原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(34)-文章发布系统①-简要分析 系列目录 最新比较闲,为了学习下Android的开发构建ASP.NET ...

  9. cocos2d-x 3.0 final 中文显示

    cocos2d-x 3.0的中文显示非常easy,首先,你须要一个xml文件保存中文,还须要一个能显示中文的TTF文件 <?xml version="1.0" encodin ...

  10. 经典SQL语句大全之基础

    一.基础 1.说明:创建数据库CREATE DATABASE database-name 2.说明:删除数据库drop database dbname 3.说明:备份sql server--- 创建 ...