primera versión del código:

 const myobj = { a1 : 10, b1 : 20, c1 : 30, myfunc1 :function() { console.log(this) const myfunc2 = function () { let a2 =100 console.log(this) } myfunc2() } } myobj.myfunc1()

producción :

 {a1: 10, b1: 20, c1: 30, myfunc1: ƒ} Window {window: Window, self: Window, document: document, name: '', location: Location, …}

segunda versión del código:

 const myobj = { a1 : 10, b1 : 20, c1 : 30, myfunc1 :function() { console.log(this) const myfunc2 = () => { let a2 =100 console.log(this) } myfunc2() } } myobj.myfunc1()

producción :

 Object a1: 10 b1: 20 c1: 30 myfunc1: ƒ ()[[Prototype]]: Object Object a1: 10 b1: 20 c1: 30 myfunc1: ƒ ()[[Prototype]]: Object

Tengo problemas para entender el comportamiento de esta palabra clave en javascript

mi problema: en mi primera versión del código, cuando llamo a esta palabra clave dentro de myfunc1, hace referencia a myobj pero dentro de la misma función cuando creo otra función como myfunc2 y la llamo dentro de la función, entonces hace referencia al objeto de la ventana por qué se está comportando así a pesar de que la función se llama y se crea dentro del literal del objeto myobj

En mi segunda versión del código, cuando llamo a esta palabra clave dentro de myfunc1, hace referencia a myobj y dentro de la misma función cuando creo otra función como myfunc2 y la llamo dentro de la función myfunc1, hace referencia al objeto myobj literal como toma la función de flecha el ámbito en el que se ha creado

mi problema es por qué en la primera versión del código, aunque la función se crea y se llama dentro del literal myobj, hace referencia al objeto de la ventana