Co się stało z programowaniem obiektowym w JS?

Article View: pl.comp.www

Article #408621

#408621

From: Marek S
Date: Sat, 20 Jan 2018 15:34

77 lines
2866 bytes

Witam,

Kiedyś zrobiłem spory projekt w JS, który jakiś czas temu przestał 
działać. Postanowiłem przyjrzeć się sprawie. Okazało się, że styl 
programowania "obiektowego" jaki używałem przestał działać. Przykład 
poniżej.

Funkcje prywatne (f1, f2) kiedyś definiowało się wewnątrz innej funkcji. 
Funkcje mogły się wzajemnie wywoływać zachowując kontekst obiektu 
(testClass). Wszystko pięknie działało lata ... i przestało nagle 
(sprawdzałem Edge, Firefox).

W poniższym przykładzie kliknięcie przycisków "test" i "test2" powoduje, 
że zadziałają funkcje odpowiednio f1 (prywatna) i f3 (publiczna). 
Natomiast wywołanie z ich poziomu innej funkcji prywatnej (f2) powoduje, 
że traci ona kontekst obiektu (testClass). Jej operator this wskazuje na 
obiekt Window!!! Funkcja f2 traktowana jest tak jakby była poza klasą 
testClass. Mało tego, analizując inny przypadek, this stał się nawet 
"undefined". Zawsze chodzi o to samo: wywołanie jakiejś prywatnej 
funkcji w obiekcie z poziomu innej - przestało być możliwe z zachowanie 
kontekstu.

Przykład zacznie działać gdy zamiast wywoływać f2(), wywołam 
f2.bind(this)().

Co się stało, że powszechnie stosowane metody nagle padły? Czy da się to 
jakoś przywrócić do życia bez przerabiania tysięcy linii kodu?


<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script>
var tc;
	
function testClass()
	{
	function f2()
		{
		console.log("f2",this===tc);
		}

	function f1()
		{
		console.log("f1",this===tc);
		f2();
		}
		
	this.f3=function()
		{
		console.log("f3",this===tc);
		f2();
		}
		
	document.getElementById("test").addEventListener("click",f1.bind(this))
	}

function init()
	{
	tc=new testClass();
	}
	
window.addEventListener("load",init);	
	
</script>
</head>

<body>
<button type="button" id="test">test</button>
<button type="button" onClick="tc.f3()">test 2</button>
</body>
</html>

-- 
Pozdrawiam,
Marek

Technical Details

Message-ID: <p3vnhr$pd1$1@node1.news.atman.pl>

Path: mbox-mo1.pugleaf.net!news-archive.icm.edu.pl!news.icm.edu.pl!newsfeed2.atman.pl!newsfeed.atman.pl!.POSTED!not-for-mail

Show Full Headers

Complete Article Headers

Path: mbox-mo1.pugleaf.net!news-archive.icm.edu.pl!news.icm.edu.pl!newsfeed2.atman.pl!newsfeed.atman.pl!.POSTED!not-for-mail
From: Marek S <precz@spamowi.com>
Newsgroups: pl.comp.www
Subject: Co się stało z programowaniem obiektowym w JS?
Date: Sat, 20 Jan 2018 16:34:18 +0100
Organization: ATMAN - ATM S.A.
Lines: 77
Message-ID: <p3vnhr$pd1$1@node1.news.atman.pl>
NNTP-Posting-Host: 89-69-207-111.dynamic.chello.pl
Mime-Version: 1.0
X-Trace: node1.news.atman.pl 1516462459 26017 89.69.207.111 (20 Jan 2018 15:34:19 GMT)
X-Complaints-To: usenet@atman.pl
NNTP-Posting-Date: Sat, 20 Jan 2018 15:34:19 +0000 (UTC)
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:52.0) Gecko/20100101 Thunderbird/52.5.2
X-Mozilla-News-Host: news://news.atman.pl:119
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit