2.3JavaScript语言的对象(Object)、类(Class)、继承(Inheritance)、访问器(Getter/Setter)

对象(Object)

1.对象字面量创建法

对象的字面量(literal)创建法是手动的写出对象的属性来创建一个对象的方式。

let objectName = {
  propertyName1 : Value1,
  propertyName2 : Value2,
  propertyName3 : Value3
};

示例:

let person = {
  name : ['Bob', 'Smith'],
  age : 32,
  gender : 'male',
  interests : ['music', 'skiing'],
  bio : function() {
    alert(this.name[0] + ' ' + this.name[1] + ' is ' + this.age + ' years old. He likes ' + this.interests[0] + ' and ' + this.interests[1] + '.');
  },
  greeting: function() {
    alert('Hi! I\'m ' + this.name[0] + '.');
  }
};

一个对象由许多的属性组成,每一个属性都拥有一个名字(像上面的name、age),和一个值(如[‘Bob’, ‘Smith’]、32)。每一个名字/值(name/value)被逗号分隔开,并且名字和值之间由冒号(:)分隔,所以可以把对象想象成哈希或散列。

对象属性的值可以是任意的,在我们的person对象里有字符串(string),数字(number),两个数组(array),两个函数(function)。前4个被称为对象的属性(property),一个属性的值可以是函数,这种情况下,后2个属性被称为方法。

此外,可以用一个对象来做另一个对象成员的值。

name : {
  first : 'Bob',
  last : 'Smith'
},

2.对象操作符new创建法

let objectName = new Object([arg1[, arg2[, ..., argN]]]);

使用new操作符创建 Object 的一个新实例,然后再给对象添加属性和方法。

let person = new Object();  
person.name = "张三";
person.age = 28;
person.sayName = function() {
  console.log(this.name);
};

3.访问对象属性

//类似于C#,Java的形式
objectName.propertyName

//类似于PHP关联数组的形式,属性名称必须是字符串或符号(Symbol)。
object['propertyName']

类(Class)

类是“特殊的函数”,就像你能够定义的函数声明和函数表达式一样,定义类的方法有两种:类声明和类表达式。

不过,与函数声明不同的是,类声明不可以提升(hoist),其次,函数受函数作用域限制,而类受块作用域限制。

1.类声明定义法

类声明 是定义类的一种方式。要声明一个类,你可以使用带有class关键字的类名。

class Rectangle {
  //类体
}

2.类表达式定义法

类表达式 是定义类的另一种方法。类表达式与函数表达式一样,可以命名或不命名。

// 未命名/匿名类
let Rectangle = class {
  //类体
};
console.log(Rectangle.name);
// output: "Rectangle"

// 命名类
let Rectangle = class Rectangle2 {
  //类体
};
console.log(Rectangle.name);
// 输出: "Rectangle2"

3.构造函数

使用 new 操作符创建类的新实例时,会同时调用constructor这个构造函数。

class Person {
  constructor() {
    //构造函数体
  }
}

4.类方法

static 关键字用来定义一个类的一个静态方法。调用静态方法不需要实例化该类,但不能通过一个类实例调用静态方法。静态方法通常用于为一个应用程序创建工具函数。

class Point {
  static methodName() {
    //静态方法体
  }
}

5.实例方法

class Point {
  methodName() {
    //实例方法体
  }
}

继承(Inheritance)

关键字 extends 用于子类单继承一个父类。

  • 基类字段初始化
  • 基类构造函数初始化
  • 子类字段初始化
  • 子类构造函数初始化
class ChildClass extends ParentClass { ... }

访问器(Getter/Setter)

var person = {
  firstName: "Bill",
  lastName : "Gates",
  language : "en",

  get lang() {
    return this.language;
  }
  
  set lang(lang) {
    this.language = lang;
  }
};

原创文章,作者:huoxiaoqiang,如若转载,请注明出处:https://www.huoxiaoqiang.com/frond/javascript/4729.html

发表评论

登录后才能评论