JavaScript 对象、函数和继承

JavaScript 中的对象和函数都是重要的概念。对象是一组键值对的集合,可以包含函数,而函数是执行任务和返回值的代码块。继承是一种机制,它允许我们在一个对象上定义对象的属性和属性行为,并通过 "继承",使一个对象能够访问另一个对象的属性和方法。

JavaScript 对象

JavaScript 中的对象是由花括号 {} 包裹的一组键值对。例如:

let person = {
  name: 'John',
  age: 30,
  address: {
    street: '123 Main St',
    city: 'San Francisco',
    state: 'CA'
  },
  sayHi() {
    console.log(`Hi, my name is ${this.name} and I am ${this.age} years old.`)
  }
};

在上面的代码中,我们创建了一个 person 对象,它有一个 nameageaddress 属性,每个属性都有对应的值。address 属性是一个嵌套的对象,里面又有三个属性。sayHi 是一个函数,该函数可以输出相应的信息。

我们可以通过点号 . 或括号 [] 来访问对象的属性,例如:

console.log(person.name); // 输出 "John"
console.log(person['age']); // 输出 30
console.log(person.address.city); // 输出 "San Francisco"
person.sayHi(); // 输出 "Hi, my name is John and I am 30 years old."

JavaScript 函数

JavaScript 中的函数是一种代码块,它可以接受参数并返回值。例如:

function add(a, b) {
  return a + b;
}

console.log(add(2, 4)); // 输出 6

在上面的代码中,我们定义了一个 add 函数,它获取两个参数 ab,并返回它们的总和。

我们还可以使用箭头函数来定义函数,例如:

const add = (a, b) => a + b;

console.log(add(2, 4)); // 输出 6

在上面的代码中,我们使用了箭头函数来定义函数,这比常规函数要更简洁。

JavaScript 继承

JavaScript 中的继承是通过原型链来实现的。每一个对象都有一个指向其原型的内部属性 [[Prototype]],通过该属性,一个对象可以访问其父对象的属性和方法。例如:

let person = {
  name: 'John',
  age: 30,
  sayHi() {
    console.log(`Hi, my name is ${this.name} and I am ${this.age} years old.`)
  }
};

let student = Object.create(person);
student.major = 'Computer Science';

console.log(student.name); // 输出 "John"
console.log(student.major); // 输出 "Computer Science"
student.sayHi(); // 输出 "Hi, my name is John and I am 30 years old."

在上面的代码中,我们创建了一个 person 对象,并为 student 对象设置了其原型为 person,这样 student 就能够访问 person 对象的属性和方法了。此外,我们增加了 major 属性,该属性仅限于 student 对象。

对继承进行自定义时,我们可以使用 JavaScript 的 class 关键字来更简单地定义类。例如:

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

  sayHi() {
    console.log(`Hi, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

class Student extends Person {
  constructor(name, age, major) {
    super(name, age);
    this.major = major;
  }
}

let john = new Person('John', 30);
let jane = new Student('Jane', 22, 'Computer Science');

john.sayHi(); // 输出 "Hi, my name is John and I am 30 years old."
jane.sayHi(); // 输出 "Hi, my name is Jane and I am 22 years old."
console.log(jane.major); // 输出 "Computer Science"

在上面的代码中,我们使用 class 关键字来定义 PersonStudent 类。 Student 类从 Person 类继承,因此,Student 类可以访问其父类的所有属性和方法。super 方法在 Student 类的构造函数中被调用,用于传递参数并执行父类的构造函数。实例化对象后,我们可以使用 sayHi 方法打招呼,并访问 major 属性。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:JavaScript 对象、函数和继承 - Python技术站

(0)
上一篇 2023年5月27日
下一篇 2023年5月27日

相关文章

  • Javascript如何递归遍历本地文件夹

    在JavaScript中遍历本地文件夹可以使用Node.js的文件系统(fs)模块,递归遍历需要使用递归函数来实现。 以下是完整攻略: 1. 安装Node.js 在开发环境中,需要安装最新版的Node.js来执行JavaScript代码。Node.js可以在官网上下载:https://nodejs.org/。 2. 引入fs模块 在Node.js中,提供了一…

    JavaScript 2023年5月27日
    00
  • Python对象与引用的介绍

    Python对象与引用的介绍 在Python中,一切都是对象。对象(Object)是Python中最重要的概念之一,懂得如何管理对象在Python编程中至关重要。Python中的所有变量都是对象的一个引用,这就意味着当我们将一个对象赋值给一个变量时,实际上是将这个对象的引用赋值给变量。这也就是为什么很多人将Python描述成一门“动态”“弱化”的语言,因为我…

    JavaScript 2023年6月11日
    00
  • JavaScript 对引擎、运行时、调用堆栈的概述理解

    一、JavaScript的运行环境 JavaScript的运行环境主要分为三个部分:引擎、运行时和调用堆栈。 引擎是解析和执行JavaScript代码的程序或模块,例如Chrome浏览器的V8引擎。 运行时是为JavaScript代码提供环境的模块和API集合,例如Node.js的运行时。 调用堆栈是一种数据结构,用于跟踪程序在运行时的位置,如果程序在执行A…

    JavaScript 2023年5月28日
    00
  • 基于Javascript实现文件实时加载进度的方法

    实现文件实时加载进度的方法本质上就是通过监听HTTP请求,统计请求发起时和请求完成时的时间,并通过计算来得出百分比进度。下面是实现文件实时加载进度的详细教程: 准备工作 首先,在页面中引入jQuery: <script src="//code.jquery.com/jquery-3.3.1.min.js"></scrip…

    JavaScript 2023年5月27日
    00
  • 关于JavaScript防抖与节流的区别与实现

    下面是关于JavaScript防抖与节流的区别与实现的完整攻略。 1. 防抖与节流的定义 防抖和节流都是针对一些高频率触发的事件而出现的优化方案。它们的基本思路都是减少一些重复触发导致的性能问题。 防抖:当一个用户连续地触发某个事件时,防抖会在一定时间内只执行一次该事件,如果在这个时间段内该事件再次被触发,则重置时间。可以理解为:事件被触发后,等待一段时间,…

    JavaScript 2023年6月11日
    00
  • JavaScript style对象与CurrentStyle对象案例详解

    让我们来讲解一下“JavaScript style对象与CurrentStyle对象案例详解”的完整攻略。 什么是style对象? 在前端开发中,style对象是经常用到的一个对象。我们可以使用style对象来获取或修改指定元素的样式属性。通过style对象,我们可以直接通过JavaScript代码来修改网页的样式效果,而无需通过css文件修改。 如何获取s…

    JavaScript 2023年5月27日
    00
  • AJAX在GB2312的中文编码传输 AJAX特殊字符编码正确方法

    AJAX(Asynchronous JavaScript and XML)是一种在不重新加载页面的情况下从服务器异步获取数据的技术。在Ajax请求中,中文传输时需要注意编码的问题。在GB2312编码中,中文会以两个字节进行编码,而某些非中文字符则只使用一个字节,这可能会导致接收方在解析数据时出现混乱。以下是AJAX在GB2312编码中文传输的完整攻略: 步骤…

    JavaScript 2023年6月1日
    00
  • JavaScript中this关键字用法实例分析

    JavaScript中this关键字用法实例分析 什么是this关键字? 在 JavaScript 中, this 关键字是一个特殊的关键字,用于表示当前函数的执行环境。具体来说,this是在每个函数被调用时独立绑定的,如果没有特别指定执行环境,则 this 的默认值是全局对象 window。 this关键字的用法 在 JavaScript 中,this 关…

    JavaScript 2023年5月28日
    00
合作推广
合作推广
分享本页
返回顶部