この記事では、オブジェクト指向、コンストラクター、継承に関する問題など、JavaScript のオブジェクト指向に関する関連知識を提供します。皆様のお役に立てれば幸いです。
オブジェクト指向は私たちの実際の生活に近いものであり、オブジェクト指向は次のような用途に使用できます。現実世界の物事を記述しますが、物事は具体的なものと抽象的なものに分けられます
オブジェクト指向思考の特徴:
JavaScript では、オブジェクトは、関連するプロパティとメソッドの順序のないセットであり、文字列、値、配列、関数など、すべてのものはオブジェクトです。
オブジェクトはプロパティとメソッド
class name { // class body}
var XX = new name();
#1.2.2、コンストラクター## をインスタンス化する必要があります。
class Person { constructor(name,age) { // constructor 称为构造器或者构造函数 this.name = name; this.age = age; } say() { console.log(this.name + '你好'); }} var ldh = new Person('刘德华', 18); ldh.say()
constructor
関数の// 父类class Father { }// 子类继承父类class Son extends Father { }
例を見てみましょう:
#1.4.1. 親クラスのコンストラクターを呼び出す構文:// 父类class Person { constructor(surname){ this.surname = surname; }}// 子类继承父类class Student entends Person { constructor(surname,firstname) { super(surname); //调用父类的 constructor(surname) this.firstname = firstname; //定义子类独有的属性 }}
// 父类class Father { constructor(surname){ this.surname = surname; } saySurname() { console.log('我的姓是' + this.surname); }}// 子类继承父类class Son entends Father { constructor(surname,firstname) { super(surname); //调用父类的 constructor(surname) this.firstname = firstname; //定义子类独有的属性 } sayFirstname() { console.log('我的名字是:' + this.firstname); }}var damao = new Son('刘','德华');damao.saySurname();damao.sayFirstname();
1.4.2。親クラスの通常の関数を呼び出します
文法:class Father { say() { return '我是爸爸'; }}class Son extends Father { say(){ // super.say() super调用父类的方法 return super.say() + '的儿子'; }}var damao = new Son();console.log(damao.say());
1.4. 3注意点
メソッド内の ## を指します。 #thisこのメソッドの呼び出し元を指します在 ES6之前 ，对象不是基于类创建的，而是用一种称为构建函数的特殊函数来定义对象和它们的特征。
// 1. 利用 new Object() 创建对象var obj1 = new Object();// 2. 利用对象字面量创建对象var obj2 = {}；// 3.利用构造函数创建对象function Star(uname,age) { this.uname = uname; this.age = age; this.sing = function() { console.log('我会唱歌'); }}var ldh = new Star('刘德华',18);
注意：
new一起使用才有意义new一起使用new 在执行时会做四件事
JavaScript 的构造函数中可以添加一些成员，可以在构造函数本身上添加，也可以在构造函数内部的this上添加。通过这两种方式添加的成员，就分别称为静态成员和实例成员。
// 构造函数中的属性和方法我们称为成员，成员可以添加 function Star(uname,age) { this.uname = uname; this.age = age; this.sing = function() { console.log('我会唱歌'); } } var ldh = new Star('刘德华',18); // 实例成员就是构造函数内部通过this添加的成员 uname age sing 就是实例成员 // 实例成员只能通过实例化的对象来访问 ldh.sing(); Star.uname; // undefined 不可以通过构造函数来访问实例成员 // 静态成员就是在构造函数本身上添加的成员 sex 就是静态成员 // 静态成员只能通过构造函数来访问 Star.sex = '男'; Star.sex; ldh.sex; // undefined 不能通过对象来访问
构造函数方法很好用，但是存在浪费内存的问题。
prototype属性，指向另一个对象，注意这个prototype就是一个对象，这个对象的所有属性和方法，都会被构造函数所拥有prototype对象上，这样所有对象的实例就可以共享这些方法问答：原型是什么？
prototype为原型对象问答：原型的作用是什么？
_proto_指向构造函数的prototype原型对象，之所以我们对象可以使用构造函数prototype原型对象的属性和方法，就是因为对象有_proto_原型的存在。_proto_对象原型和原型对象prototype是等价的_proto_对象原型的意义就在于为对象的查找机制提供一个方向，或者说一条路线，但是它是一个非标准属性，因此实际开发中，不可以使用这个属性，它只是内部指向原型对象prototype
Star.prototype 和 ldh._proto_指向相同对象原型(__ proto __)和构造函数(prototype)原型对象里面都有一个属性constructor属性， constructor 我们称为构造函数，因为它指回构造函数本身。
constructor主要用于记录该对象引用于哪个构造函数，它可以让原型对象重新指向原来的构造函数
一般情况下，对象的方法都在构造函数(prototype)的原型对象中设置
如果有多个对象的方法，我们可以给原型对象prototype采取对象形式赋值，但是这样会覆盖构造函数原型对象原来的内容，这样修改后的原型对象constructor就不再指向当前构造函数了。此时，我们可以在修改后的原型对象中，添加一个constructor指向原来的构造函数
具体请看实例配合理解
_proto_指向的prototype原型对象)
this指向我们的实例对象this指向的是这个方法的调用者，也就是这个实例对象注意：
Array.prototype = {}，只能是Array.prototype.xxx = function(){}的方式ES6 之前并没有给我们提供extends继承
调用这个函数，并且修改函数运行时的 this 指向
fun.call(thisArg,arg1,arg2,......)
thisArg：当前调用函数 this 的指向对象arg1,arg2： 传递的其他参数示例
call()把父类型的 this 指向子类型的 this，这样就可以实现子类型继承父类型的属性核心原理：
prototype 原型对象 = new 父类()constructor重新指向子类的构造函数prototype属性上_proto_指向类的prototype原型对象ES5 给我们新增了一些方法，可以很方便的操作数组或者字符串
array.forEach(function(currentValue,index,arr))
array.filter(function(currentValue,index,arr))
filter()方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素，主要用于筛选数组some()方法用于检测数组中的元素是否满足指定条件（查找数组中是否有满足条件的元素）trim()方法会从一个字符串的两端删除空白字符trim()方法并不影响原字符串本身，它返回的是一个新的字符串Object.keys()用于获取对象自身所有的属性for...inObject.defineProperty()定义对象中新属性或修改原有的属性(了解)Object.defineProperty(obj,prop,descriptor)
var fn = new Function('参数1','参数2',.....,'函数体');
Function 里面参数都必须是字符串格式
第三种方式执行效率低，也不方便书写，因此较少使用
所有函数都是 Function 的实例(对象)
函数也属于对象
this指向，是当我们调用函数的时候确定的，调用方式的不同决定了this的指向不同，一般我们指向我们的调用者| 调用方式 | this指向 |
|---|---|
| 普通函数调用 | window |
| 构造函数调用 | 实例对象，原型对象里面的方法也指向实例对象 |
| 对象方法调用 | 该方法所属对象 |
| 事件绑定方法 | 绑定事件对象 |
| 定时器函数 | window |
| 立即执行函数 | window |
bind(),call(),apply()三种方法call()方法调用一个对象，简单理解为调用函数的方式，但是它可以改变函数的this指向fun.call(thisArg,arg1,arg2,.....)thisArg: 在 fun 函数运行时指定的 this 值arg1,arg2: 传递的其他参数apply()方法调用一个函数，简单理解为调用函数的方式，但是它可以改变函数的this指向fun.apply(thisArg,[argsArray])bind()方法不会调用函数。但是能改变函数内部this指向fun.bind(thisArg,arg1,arg2,....)this值和初始化参数改造的原函数拷贝call apply bind 总结：
相同点：
this指向区别点：
call和apply会调用函数，并且改变函数内部的this指向call和apply传递的参数不一样，call 传递参数，apply 必须数组形式bind不会调用函数，可以改变函数内部this指向主要应用场景
call经常做继承apply经常跟数组有关系，比如借助于数学对线实现数组最大值与最小值bind不调用函数，但是还想改变this指向，比如改变定时器内部的this指向相关推荐：javascript学习教程
以上がJavaScript のオブジェクト指向の側面を整理する (概要の共有)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
