zoukankan      html  css  js  c++  java
  • JS对象学习(二)

    一:JavaScript 对象访问器

    1.getter和setter

    提供两种方式实例
    例子 1

    var person = {
    firstName: "Bill",
    lastName : "Gates",
    fullName : function() {
    return this.firstName + " " + this.lastName;
    }
    };
    

    // 使用方法来显示来自对象的数据:

    document.getElementById("demo").innerHTML = person.fullName();
    

    例子 2

    var person = {
    firstName: "Bill",
    lastName : "Gates",
    get fullName() {
    return this.firstName + " " + this.lastName;
    }
    };
    

    // 使用 getter 来显示来自对象的数据:

    document.getElementById("demo").innerHTML = person.fullName;
    

    例子 1 以函数形式访问 fullName:person.fullName()。
    例子 2 以属性形式访问 fullName:person.fullName。
    第二个例子提供了更简洁的语法。

    二:对象构造器

    function Person(first, last, age, eye) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eye;
    }
    

    在上面的例子中,函数 Person() 就是对象构造器函数。
    通过 new 关键词调用构造器函数可以创建相同类型的对象:

    var myFather = new Person("Bill", "Gates", 62, "blue");
    var myMother = new Person("Steve", "Jobs", 56, "green");
    

    this关键字

    在构造器函数中,this 是没有值的。它是新对象的替代物。 当一个新对象被创建时,this 的值会成为这个新对象。
    请注意 this 并不是变量。它是关键词。您无法改变 this 的值。
    注意:向对象中添加属性以及方法简单,但是不能直接向构造器中添加属性与方法,如需向构造器添加一个新属性,您必须添加到构造器函数,如需向构造器添加一个新方法,
    必须在构造器函数内部向一个对象添加方法:

    1.内建 JavaScript 构造器

    JavaScript 提供用于原始对象的构造器:

    实例

    var x1 = new Object();    // 一个新的 Object 对象
    var x2 = new String();    // 一个新的 String 对象
    var x3 = new Number();    // 一个新的 Number 对象
    var x4 = new Boolean();   // 一个新的 Boolean 对象
    var x5 = new Array();     // 一个新的 Array 对象
    var x6 = new RegExp();    // 一个新的 RegExp 对象
    var x7 = new Function();  // 一个新的 Function 对象
    var x8 = new Date();      // 一个新的 Date 对象
    

    可以被如下代替

    var x1 = {};            // 新对象
    var x2 = "";            // 新的原始字符串
    var x3 = 0;             // 新的原始数值
    var x4 = false;         // 新的原始逻辑值
    var x5 = [];            // 新的数组对象
    var x6 = /()/           // 新的正则表达式对象
    var x7 = function(){};  // 新的函数对象
    

    三:对象原型

    使用 prototype 属性
    JavaScript prototype 属性允许您为对象构造器添加新属性:
    实例

    function Person(first, last, age, eyecolor) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eyecolor;
    }
    Person.prototype.nationality = "English";
    

    JavaScript prototype 属性也允许您为对象构造器添加新方法:
    实例

    function Person(first, last, age, eyecolor) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eyecolor;
    }
    Person.prototype.name = function() {
    return this.firstName + " " + this.lastName;
    };
  • 相关阅读:
    切图常用快捷键
    统计网页访问量的代码
    jQuery $.each用法
    js数组去重的三种常用方法
    React中的context的用法和使用场景和发布-订阅模式
    工具函数
    前端安全
    面试题整理
    学习的一些链接
    工厂模式、构造函数模式、原型模式、构造函数模式+原型模式
  • 原文地址:https://www.cnblogs.com/xing--/p/14335833.html
Copyright © 2011-2022 走看看