プロトタイプ：3つの質問の魂 - [ペット]フロントエンドJSの面接の質問の粉末チャネルを説明するために私に尋ねましたか？どのようなプロトタイプのクラスですか？プロト・オブジェクトとは何ですか

その他 2019-12-26 03:33:47 訪問数: null

ファイル

著者| Jeskson

ソース|ダダフロントエンドビストロ

1

何種類のトピックの私は見習いそれを疑うしましょうか？のは、最初のWXグループから、スクリーンショットを見てみましょう：

ファイル

私は答えた方法を確認するには：

ファイル

ファイル

ファイル

ファイル

ファイル

function Foo() {
    getName = function () { alert (1); };
    return this;
}
var getName;
//只提升变量声明

function getName() { alert (5);}
//提升函数声明，覆盖var的声明

Foo.getName = function () { alert (2);};

Foo.prototype.getName = function () { alert (3);};

getName = function () { alert (4);};
//最终的赋值再次覆盖function getName声明

getName();
//最终输出4

私はそれを理解していませんでしたか？：ハは心配しないで理解していませんでした

私たちは、関数の定義を理解してみましょう：

関数の宣言は、修正再表示を呼び出すことができます

dadaFn();

function dadaFn(){
 console.log(dadaFn);
}

ファイル

/ 返回 f -> function
function dadaFn() {
 console.log(dadaFn);
}

関数式、最初の文、その後の呼び出し：

let daDafn = function() {
 console.log("dada");
};

daDafn();

ファイル

let fn = function() {
    console.log(111);
}
fn(); //111
VM1188:2 111
undefined
let daDafn = function() {
 console.log("dada");
}

daDafn();
VM1197:2 dada
undefined

アロー機能：

let da = () => {};

console.log( da.prototype );

ファイル

JavaScriptのprototypeプロパティを使用すると、オブジェクトにプロパティとメソッドを追加することができます：

フォーマット：

object.prototype.name = value;

オブジェクトにプロパティを追加するprototypeプロパティを使用します。

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

var dashu = new dada("dashucoding", 13);

dada.prototype.job = null;

dashu.job = it;

console.log(dashu.jog);

出力：

it

コンストラクタ：

let da1 = new Function('a', 'b');

da1(1,2);

ファイル

let da1 = new Function('a', 'b');

da1(1,2);

VM65:3 Uncaught ReferenceError: b is not defined
    at eval (eval at <anonymous> (local-ntp.html:1), <anonymous>:3:1)
    at <anonymous>:3:1
(anonymous) @ VM65:3
(anonymous) @ VM64:3

let fn1 = new Function('a', 'b',  'console.log(a * b)');
fn1(1, 2); //2
VM69:3 2
undefined

前の解像度、可変のリフティング概念：

ファイル

インタビューの質問

ファイル


function Foo() {
    getName = function () { console.log (1); };
    return this;
}
Foo.getName = function () { console.log (2);};
Foo.prototype.getName = function () { console.log (3);};
var getName = function () { console.log (4);};
function getName() { console.log (5);}

//请写出以下输出结果：
Foo.getName();

getName();

Foo().getName();

getName();

new Foo.getName();

new Foo().getName();

new new Foo().getName()；

VM243:5 2
VM243:7 4
VM243:2 1
VM243:2 1
VM243:5 2
VM243:6 3
VM243:6 3
//答案：
Foo.getName();//2
getName();//4
Foo().getName();//1
getName();//1
new Foo.getName();//2
new Foo().getName();//3
new new Foo().getName();//3

変数定義を持ち上げ、このポインタが指す、演算子の優先順位

プロトタイプ、相続、グローバル変数汚染、オブジェクト属性および属性のプロトタイプの優先順位

ソウル3つの質問：

プロトタイプ？どのようなプロトタイプのクラスですか？プロト・オブジェクトとは何ですか？

JavaScriptでは、プロトタイプオブジェクトは、オブジェクト指向実装するための重要なメカニズムです。

各関数は、オブジェクト（機能）であるクラスの関数が定義されているように、関数オブジェクトは、子オブジェクトのプロトタイプオブジェクトを有しています。プロトタイプ関数のプロトタイプを表し、クラスのメンバーのセットが言いました。

オブジェクト指向のメカニズム

新しい時間によってクラスのインスタンスを作成し、プロトタイプオブジェクトのメンバーは、メンバーになるには、オブジェクトをインスタンス化しています。

; 1、オブジェクトは、使用可能な関数オブジェクトの参照、クラスによって参照される
新しいインスタンス後、2、及びそのメンバーを呼び出す前に、オブジェクトのインスタンスをインスタンス化しています。

同時に、この関数は関数オブジェクトが直接メンバーを宣言した場合、通話にインスタンス化されていない、オブジェクトです。

定義と使用法

prototypeプロパティは、あなたのオブジェクトにプロパティやメソッドを追加することができます。

簡単なコンストラクタ

ファイル

function Person(){
 this.name = 'dada';
}
 var boy = new Person();
console.log(boy.name); //'dada'
VM254:5 dada
undefined

ファイル

prototypeプロパティの役割

オブジェクトインスタンスコンストラクタの特性の間で共有することができない欠点に対処するために、JSは、プロトタイプのプロパティを提供します。

各データ型は、（NULLおよび未定義を除く）オブジェクトJSあります。

他のオブジェクトから各オブジェクトの継承、「プロトタイプ」（プロトタイプ）オブジェクトとして知られている後者は、ヌルを除いて、それはそれ自身のプロトタイプオブジェクトを有していません。

原型对象上的所有属性和方法，都会被对象实例所共享。

通过构造函数生成对象实例时，会将对象实例的原型指向构造函数的prototype属性。

每一个构造函数都有一个prototype属性，这个属性就是对象实例的原型对象。

原型对象的属性不是对象实例的属性。

prototype是作为构造函数的属性

对于对象实例来说，prototype是对象实例的原型对象。

所以prototype即是属性，又是对象。

ファイル

原型链:原型链主要用于继承，每个对象都有一个proto属性指向其构造函数的原型对象，当访问对象的属性和方法时，会先在对象自身进行查找，如果不存在,则沿着proto属性向上一级查找，直到没找到返回 undefined，这样的查找过程，称之为原型链。

原型链，请找我文章：一篇文章带你了解JavaScript中的变量，作用域，和内存问题。

function Foo() {
    getName = function () { console.log (1); };
    return this;
}
Foo.getName = function () { console.log (2);};
Foo.prototype.getName = function () { console.log (3);};

var getName = function () { console.log (4);};
function getName() { console.log (5);}

//请写出以下输出结果：
Foo.getName();  // 2

看代码，先定义一个Foo()的函数，之后为Foo创建一个叫getName的静态属性，用来存储一个匿名的函数，之后为Foo的原型对象，新创建了一个叫getName的匿名函数。

var getName = function () { console.log (4);};
function getName() { console.log (5);}

然后通过函数变量表达式，创建一个getName的匿名函数，然后由通过函数变量表达式，创建一个getName的函数。

最后一个是声明一个叫getName的函数。

Foo.getName();  // 2

这个不用说就是访问Foo()函数上存储的静态属性，答为2。

下一个问：

getName();

Foo().getName();

getName();

new Foo.getName();

new Foo().getName();

new new Foo().getName()；
getName(); 的答案呢？ // 5

function Foo() {
    getName = function () { console.log (1); };
    return this;
}

这里要分开理解看

Foo.getName = function () { console.log (2);};
Foo.prototype.getName = function () { console.log (3);};

var getName = function () { console.log (4);};
function getName() { console.log (5);}

预解析/变量提升

ファイル

function Foo() {
    getName = function () { alert (1); };
    return this;
}
var getName;
//只提升变量声明

function getName() { alert (5);}
//提升函数声明，覆盖var的声明

Foo.getName = function () { alert (2);};
getName = function () { alert (4);};
//最终的赋值再次覆盖function getName声明

getName();
//最终输出4

var getName 只提升变量声明

function getName 函数声明，覆盖var的声明

第二个答案

直接调用getName()函数，就是访问当前上文作用域内的叫getName的函数

ファイル

这样var getName提升，函数整体提升到上面了，那么就剩下getName结果为4的那个了。

第三个问是：// 1

一个是变量作用域问题，一个是this指向问题。

Foo().getName();

第一个Foo()函数：

function Foo() {
 getName = function() {
  console.log('1');
 }
}

即Foo().getName()中

ファイル

先执行Foo()函数，然后调用Foo函数返回的返回值对象的getName属性函数。

ファイル

第四个：

getName(); // 函数 1

相当window.getName（）、Fooの機能は、同じ結果が1である場合、この変数が変更されるからです。

ファイル

5 Q：

new Foo.getName();

ファイル

新しい操作よりもポイント高い優先順位は同等です：

new (Foo.getName)();
// 将getName函数作为了构造函数来执行
// 2

六件の答え：

ファイル

new Foo().getName(); // 3
// 运算符优先级括号高于new

等价于
(new Foo()).getName()

FOO関数は値を返し、次にコンストラクタとして、最初に行います。

ファイル

戻り値がチェックされている場合、戻り値は、参照型であります

ファイル

戻り値は参照型である場合、戻り値は、実際には参照型です。

ファイル

价于
(new Foo()).getName()
# ```
![file](https://img2018.cnblogs.com/blog/1434670/201912/1434670-20191226013208533-1209568798.jpg)

。新しい新しいはFoo（）のgetName（）;

新（（新しいはFoo（））のgetName。）（）;

// 3
`` `

❤️DOは学習あなたの足跡を残すことを忘れないで[コメント+ +のように収集ポイント]

情報を著者：

[著者]：Jeskson
[オリジナル]公開番号：ダダフロントエンドビストロ。
[福祉]：自己学習教材をまくるに送信されませ公共返信「情報」（シェアへのグループには何がハを言いたい、私は見ませんでした）！
[予約]説明：ソースを明記してください、ありがとう再現！〜

大規模なテクノロジ・スタックのブログを配置するフロントエンド開発、フロントエンドの開発、PHPの背景知識、ウェブフルスタック技術分野、データ構造とアルゴリズム、およびそう簡単にネットワーク理論を理解するためには、ジュニアパートナーに提示されます。、あなたがサポートして愛の礼儀をありがとうございました！！！

ローカルコンテンツのこの数はビットを取得しない場合（例：著作権やその他の問題に）、タイムリーにすることができ整流のための私達に連絡し、最初の時間に処理されますしてください。

親指アップしてください！あなたが同意しているので/励ましは、私の文章の最大の力です！

ようこそ注意ダダさんCSDN！

これは、品質、態度のブログです

フロントエンド技術スタック

おすすめ

転載: www.cnblogs.com/dashucoding/p/12099948.html
おすすめ
米国は中国とロシアへの大型AIモデルの輸出を制限する計画
Apple、ChatGPTをiPhoneに導入することでOpenAIと合意に達する
ランキング
エコー、Linuxは最も悲しいコマンドです
OpenCVの目標追跡 - 黄Chaoxian
インターバルマージ [ペア、ソート]
Javaの8並行プログラミング
時間を[行く]包
2つのソリューションCSS揃えテキスト
ASP.NET MVCのコアアプリケーションのバックグラウンドタスク
JAVAのドキュメントは、カスタムプロパティを記述する
オーディオとビデオに基づくビデオの主なコンセプト
phpstudyバックドアRCE使用バッチスクリプト
アーカイブ
もっと
2024-05-11(31)
2024-05-10(33)
2024-05-09(30)
2024-05-08(18)
2024-05-07(34)
2024-05-06(6)
2024-05-05(0)
2024-05-04(18)
2024-05-03(8)
2024-05-02(0)

コードワールド

© 2018 codetd.com