let nameとthis.nameの違いについて

Question

前提・実現したいこと

はじめまして。
javascriptの初学者です。

以下のコードで理解できない部分があります。
ネットや本で調べても腑に落ちません。

web.name = "BBB";
この1行が無くても出力結果は同じAAAです。
その理由がよく分かりません。

自分は初見で
let name = name1; と
web.name = "BBB"; の部分の解釈があやふやなため、
出力結果はBBBなのかなと思いました。

どなたか教えていただけませんでしょうか。
よろしくお願い致します。

該当のソースコード

const Web = function (name1) {     
let name = name1;     
this.show = function () {  
console.log(name);
     } 
 } 

const web = new Web('AAA'); 
web.name  = "BBB"; 
web.show(); 

 //出力結果：AAA

Comments

[m.ts10806]

解決後ですが、

コードやエラーはマークダウンのcode機能を利用してご提示ください。
https://teratail.com/questions/238564
「初心者アイコン」を質問に付けられるのでそちらを利用してください。
タイトルが汎用的すぎます。一意のものとなるよう、要件を記載してください。

[退会済みユーザー]

ご指摘ありがとうございます。
アドバイスに従いまして、内容を訂正致しました。
ご確認いただければ幸いです。

Answer 1

その理由がよく分かりません。

this.showから参照しているnameは、Web関数内で定義されたローカル変数です。

web.name = "BBB"; として代入される結果を取りたいなら、this.nameと書く必要があります。

Comments

[退会済みユーザー]

こんにちは。
早速の回答、どうもありがとうございました。
実は某試験の類似問題なのですが、解説が付いていなかったので、自分で調べてもよく分からず困っておりました。
maisumakun様が最初に回答して下さったので、ベストアンサーにさせていただきます。

Answer 2

letではなくthisでnameを宣言します

let name = name1;    
this.show = function () {  
  console.log(name);
}

を

this.name = name1;    
this.show = function () {  
  console.log(this.name);
}

にしましょう

Comments

[退会済みユーザー]

はじめまして。
ご親切にサンプルコードまで書いていただいて、どうもありがとうございました。お陰様でようやく理解ができました。大変助かりました。