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】3592 World Exhibition

    基础差分约束. /* 3592 */ #include <iostream> #include <algorithm> #include <queue> #incl ...

  2. (转载)[MySQL技巧]INSERT INTO… ON DUPLICATE KEY UPDATE

    (转载)http://blog.zol.com.cn/2299/article_2298921.html MySQL 自4.1版以后开始支持INSERT … ON DUPLICATE KEY UPDA ...

  3. Eclipse Maven插件无法搜索远程库

    创建Maven工程,发现添加依赖“Add Dependency”的时候无法自动搜索远程库. 导致此问题的可能原因: 1.update index的时候失败了. 解决:打开Window/Show Vie ...

  4. JVM内存管理和JVM垃圾回收机制

    JVM内存管理和JVM垃圾回收机制(1) 这里向大家描述一下JVM学习笔记之JVM内存管理和JVM垃圾回收的概念,JVM内存结构由堆.栈.本地方法栈.方法区等部分组成,另外JVM分别对新生代和旧生代采 ...

  5. 不同车型 不同起步价不同费用的问题(switch语句)

    #include "stdio.h" #include "math.h" main() { int a; float meet,b; printf(" ...

  6. 53个要点提高php效率

    用单引号代替双引号来包含字符串,这样做会更快一些.因为PHP会在双引号包围的字符串中搜寻变量,单引号则不会,注意:只有echo能这么做,它是一种可以把多个字符串当作参数的“函数”(译注:PHP手册中说 ...

  7. 洛谷 P1026 统计单词个数

    题目描述 给出一个长度不超过200的由小写英文字母组成的字母串(约定;该字串以每行20个字母的方式输入,且保证每行一定为20个).要求将此字母串分成k份(1<k<=40),且每份中包含的单 ...

  8. (四) PHPCMSV9如何更换模板风格

    更换模板风格有两种方式: 1.复制default模板 2.到相关模板网站下载模板,推荐网站:http://www.moke8.com/phpcms/ 一.复制default模板  将phpcms默认的 ...

  9. 关于在VMware上装lFEDORA系统

    VMware虚拟机启动当中某个操作系统的时候,会出现如下提示 Cannot connect virtual device floppy0. No corresponding device is ava ...

  10. ImageView 缩放

    <ImageView android:id="@+id/imageview" android:layout_width="wrap_content" an ...