記事ディレクトリ
クラスオブジェクトの作成
これはes6の新しい方法です。クラスは単なる構文上の砂糖と見なすことができます。新しいクラスの記述により、オブジェクトプロトタイプの記述がより明確になり、オブジェクト指向プログラミングの構文に似たものになります。次のコードは、peopleクラスを定義するだけでなく、Coderを実装しています、そして俳優の人々の遺産
class People{
constructor(name){
this.name = name
}
eat(){
console.log(`${this.name} eat something`)
}
}
class Coder extends People{
constructor(name,id){
super(name)
this.id=id
}
coding(){
console.log(this.name+'is coding')
}
}
class Actor extends People {
constructor(name,sex){
super(name)
this.sex = sex
}
act(){
console.log(`${this.name} act in the movie is ${this.sex}`)
}
}
const zhangsan = new Coder('张三',9547)
zhangsan.coding()
const li = new Coder('aa',5456)
console.log(li.coding()=== zhangsan.coding())
const huge = new Actor('胡歌','男')
huge.act()
次の注意点は、上記の分析によりクラスの理解を強化できることです：
zhangsan instanceof People
zhangsan instanceof Coder
zhangsan instanceof Object
//上記の判断はすべてtrueの
タイプのCoder
typeofアクター
はすべて
コンソール入力に対するコードですCoder.prototype === zhangsan。プロト真と判断
zhangsan。プロトは暗黙プロトタイプと呼ばれる
Coder.prototypeプロトタイプは、明示的と呼ばれる
各クラスは、プロトタイプディスプレイ有する
各インスタンス暗黙プロトタイプ
クラスプロトタイプのプロトタイプへの暗黙的なポインタが表示に対応する
ように、ルールのプロトタイプ実装それを見つけるのは独自のプロパティとメソッドへの最初のものである、見つけるための暗黙的なプロトタイプを見つけることができません
プロトタイプチェーン
。People.prototype === Coder.prototypeをプロト // trueに
プロトタイプとプロトタイプチェーンの詳細については、この記事をクリックしてご覧ください。
文字通りオブジェクトを作成する
JSリテラル作成メソッドの長所と短所
コンストラクターのパラメーター初期化のプロセスが省略されます短所は、初期化された値が一貫していること（各インスタンスオブジェクトには独自の特性がない）で
あり、プロトタイプの最大の短所は次のとおりです。最大の利点は共有です。
ES5オブジェクトリテラルの表現
const obj = {
name: 'liqing',
age: 18,
run: function(){
console.log('running')
}
}
オブジェクトリテラルES6の強化された書き込み
//属性的增强写法
const name= 'liqing'
const age= 18
const obj = {
name,age,
}
// 函数的增强写法
const obj = {
run(){
console.log('it is running')
}
}
ファクトリーモード
それらの多くは広く知られていません。コードを直接書く
function createPerson(name, qq) {//构造函数：功能是构造一个对象的函数
//原料
var obj = new Object();
// 当加了new时系统会偷偷的为我们做一些事情：
// var this=new Object();this指向一个空的对象
// 后面 也会 return this;
//加工
obj.name = name;
obj.qq = qq;
//出厂
obj.showName = function () {
alert('My name is ' + this.name);
}
}
var obj1=createPerson('blue','4730');
var obj2=createPerson('张三','5454545');
ファクトリアプローチの短所
// 工厂方式的缺点
// 1，没有new,一般写个对象需要new一个的；
// 2,alert(obj1.showName==obj2.showName);//false
// 要是有100个对象，会浪费系统大量的空间资源，性能低下
//问题1；
var obj1=new createPerson('blue','4730');
var obj2=new createPerson('张三','5454545');
//在创建对象调用函数是在函数前面加上一个new时，是指创建了一个新的对象
//它里面的this就会指向新创建的那个对象
コンストラクターパターン
function Person(name,age,job){
this.name=name
this.age=age
this.job=job
this.sayName = ()=>{
alert(this.name)
}
}
var Person1=new Person('lisi','18','coder')
var Person1=new Person('zhangsan','18','coder')
人物インスタンスを作成するプロセスは、新しいオブジェクトを作成します-
>コンストラクタのスコープをこのオブジェクトに割り当てます->コンストラクタコードを実行し、それにプロパティとメソッドを追加します->新しいオブジェクトを返します
機能：
オブジェクトの明確な作成はありません。
属性とメソッドはこのオブジェクトに直接割り当てられます
。returnステートメントはありません。
短所
上記のコードのようにpersonインスタンスを作成すると、各オブジェクトには異なるsay that sayname関数インスタンスが含まれます
alert(person1.sayname== person2.sayname) //false
改善方法
sayNameをコンストラクタの外でアンロードし、コンストラクタで参照します
function Person(name,age,job){
this.name=name
this.age=age
this.job=job
this.sayName = sayName
}
function sayName(){
alert(this.name)
}
プロトタイプモードでオブジェクトを作成する
これは一般的には使用されていないようです
var Person1=new Person('lisi','18','coder')
function Person(){
}
Person.prototype.name= "zhangsan"
Person.prototype.age=20
Person.prototype.job="coder"
Person.prototype.sayName=()=>{
alert(this.name)
}
var Person1=new Person()
var Person1=new Person()
Person1.name="lisi"
alert(person1.name)//lisi
alert(person2.name)//zhangsan
delete person1.name
alert(person1.name)//zhangsan
コンストラクターモードとプロトタイプモードの組み合わせ
これは非常に一般的な方法です。コンストラクタパターンを使用してインスタンスプロパティ（共有されない）を定義し、プロトタイプパターンを使用してメソッドと共有属性を定義します。さらに、この組み合わせパターンは、コンストラクタへのパラメータの受け渡しもサポートします
function Person(name,age,gender){
this.name = name;
this.age = age;
this.gender = gender;
this.hobies = ["1","2","3"];
}
Person.prototype = {
sayName : function(){
alert(this.name);
}
}
var person1 = new Person("Stan",0000,"male");
var person2 = new Person("Joe",1111,"female");
person1.colors.push("4");
alert(person1.colors); // 1 2 3 4
alert(person2.colors); // 1 2 3
alert(person1.sayName == person2.sayName); // true
動的プロトタイピング
動的プロトタイプモードは、コンストラクター内のすべての情報をカプセル化し、コンストラクターでプロトタイプを初期化することにより（必要な場合のみ）、
コンストラクターとプロトタイプを同時に使用することの利点が維持されます。つまり、プロトタイプを初期化する必要があるかどうかを判断するために特定のメソッドが効果的であるかどうか
function Person(name, age, job) {
// 属性
this.name = name;
this.age = age;
this.job = job;
// 方法
if (typeof this.sayName != "function") {
Person.prototype.sayName = function() {
alert(this.name);
}
}
}
var friend = new Person("Mary", 18, "Software Engineer");
friend.sayName();
