【超超初心者】apply()の中のthisの意味がわかりません

Question

前提

こちらのサイトを読んでいて意味がわからなくなりました。
https://www.sejuku.net/blog/64089

この「this」はapply()の第一引数を指しているのででしょうか？

該当のソースコード

<table border="1" cellspacing="0" cellpading="0">
 <thead>
  <tr class="head">
    <td>男子</td>
  </tr>
 </thead>

 <tbody id="deta1">
 </tbody>

</table>

<table border="1" cellspacing="0" cellpading="0">
 <thead>
  <tr class="head">
    <td>女子</td>
  </tr>
 </thead>

 <tbody id="deta2">
 </tbody>

</table>

table {
    width:  50%;
    max-width:  150px;
    float: left;
    margin: 10px;
}

.head {
    text-align:  center;
}

// 関数定義
function fnc() {
    var num = 1;
    for (var j = 0; j < arguments.length; j++) {
        var tr = document.createElement("tr");
        var td = document.createElement("td");
        td.innerHTML = arguments[j];
        tr.appendChild(td);
        this.appendChild(tr);
        num++; 
    }
}

// 配列の生成
var args = ['阿部太郎','加藤大輔','佐藤勇気','田中雅弘','長島貴之'];
var args2 = ['伊藤文代','木村由美子','清水絵里','茅原梓','西島和美'];

// 関数を呼び出す
var deta1 = document.getElementById("deta1");
var deta2 = document.getElementById("deta2");
fnc.apply(deta1, args);
fnc.apply(deta2, args2);

試したこと

console.logで見てみたのですが、このアクセス方法があっているかわからないと同時に、表示されているコードの意味も正確に理解できません。。。

Answer 1

function構文で作ったユーザー関数の場合、thisにはapplyの第一引数が入ります

function fnc(x,y,z){
  console.log(this); // String { "test" }
  console.log(x); // 1
};
fnc.apply("test",[1,2,3]);

Comments

[Iori]

ありがとうございます。シンプルでわかりやすい例のご掲示感謝いたします。

Answer 2

この「this」はapply()の第一引数を指しているのででしょうか？

そうです。

Function.prototype.apply()

func.apply(thisArg, [ argsArray])

何らかの理由で this を指定して関数を呼びたいときに使用するわけですが、通常はthisを使わず関数の引数にすれば十分です。初学者のうちはapply()のことはあまり気にする必要はありません。

Comments

[Iori]

ありがとうございます。ご掲示の公式サイトや他のサイトでも第一引数はthis値と書いてありました。まだまだ理解が行き届いてないなーと絶望しますが続けていきたいと思います。