JavaScript面向对象编程_javascript核心技术-js教程-PHP中文网

JavaScript面向对象编程_javascript核心技术

夢幻星辰

发布： 2025-12-03 20:10:02

原创

808人浏览过

JavaScript面向对象编程基于构造函数和原型，ES6引入class语法糖使写法更直观。1. 构造函数用于初始化实例，prototype存储共享方法；2. class中的constructor初始化属性，其他方法挂载到原型；3. 使用extends实现继承，super调用父类构造函数；4. static定义静态方法，#前缀声明私有字段；5. 实例访问自身属性及原型链上的方法，私有字段仅类内可访问。

javascript面向对象编程_javascript核心技术

JavaScript 面向对象编程（OOP）是其核心技术之一，让开发者能够以更结构化、可复用的方式组织代码。虽然 JavaScript 是基于原型的语言，不像 Java 或 C++ 那样有类的严格定义，但从 ES6 开始引入了 class 语法糖，使面向对象的写法更加直观。

构造函数与原型对象

在 ES6 之前，JavaScript 使用构造函数和原型来实现对象的创建与继承。

说明：

构造函数是一种特殊的函数，用来初始化新创建的对象。通过 new 操作符调用构造函数，可以生成实例。

每个函数都有一个 prototype 属性，指向一个对象，该对象将作为所有实例的原型。实例可以访问原型上的属性和方法。

立即学习“Java免费学习笔记（深入）”；

示例：

function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.greet = function() {
  console.log(`Hello, I'm ${this.name}`);
};

const person1 = new Person('Alice', 25);
person1.greet(); // 输出: Hello, I'm Alice

登录后复制

ES6 类语法

ES6 引入了 class 关键字，让面向对象编程更清晰易读。它本质上是构造函数和原型机制的语法糖。

基本用法：

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  greet() {
    console.log(`Hello, I'm ${this.name}`);
  }
}

const person2 = new Person('Bob', 30);
person2.greet(); // 输出: Hello, I'm Bob

登录后复制

注意：

类中的方法定义在原型上，constructor 方法用于初始化实例属性。其他方法会自动添加到原型中。

飞蛙B2B2C商城电商系统

飞蛙B2B2C（FeiWa B2B2C）商城系统是山东破浪网络科技有限公司于2017年最新推出的企业级B2B2C电商平台系统，采用PHP5+MySQL技术为基础，OOP（面向对象）方式进行核心框架搭建，结合MVC模式进行开发，可以支持Windows/Unix服务器环境，需PHP5.3及以上版本支持，可运行于包括Apache、IIS和Nginx在内的多种WEB服务器。飞蛙B2B2C（FeiWa B2

查看详情

继承与 extends

JavaScript 支持通过 extends 实现类的继承，子类可以继承父类的属性和方法。

使用 super 调用父类的构造函数或方法。

示例：

class Student extends Person {
  constructor(name, age, grade) {
    super(name, age); // 调用父类构造函数
    this.grade = grade;
  }

  study() {
    console.log(`${this.name} is studying.`);
  }
}

const student1 = new Student('Charlie', 20, 'A');
student1.greet(); // 继承自 Person
student1.study(); // Student 特有方法

登录后复制

静态方法与私有字段（现代 JS）

静态方法属于类本身，而不是实例。使用 static 关键字定义。

私有字段使用 # 前缀声明，只能在类内部访问。

示例：

class MathUtils {
  static add(a, b) {
    return a + b;
  }

  #secretValue = 42;

  showSecret() {
    console.log(this.#secretValue);
  }
}

console.log(MathUtils.add(3, 5)); // 8

const utils = new MathUtils();
utils.showSecret(); // 42
// utils.#secretValue; // 错误：无法外部访问

登录后复制

基本上就这些。掌握构造函数、原型链、class 语法、继承和静态/私有成员，就能熟练运用 JavaScript 的面向对象特性。不复杂但容易忽略细节。

以上就是JavaScript面向对象编程_javascript核心技术的详细内容，更多请关注php中文网其它相关文章！