Scope in JavaScript (part 4)(JavaScript ????????? ????????? ????????) - ??????? ?
(??????? ? ? ? ????? ? ??? ????????????????????????)
.bind() ???????? ? ???????????????? apply() ? call() ??? ? ?? ? ???????????????????????????? ?????????? .bind() ?????????? ????????? ????? ?????????? function ?? ? ??????(reference) ???? ???? (return) ????????????????????????????? ?????????????? ???????????? ??? ???????????????? ??????? ????????????? ?????????????????
<script type="text/javascript">
var _president = {
_answer: "I am the president"
};
var _secaretary = {
_answer: "I am the secaretary of president"
};
function aboutMe(greetingWord) {
return greetingWord + " " +this._answer;
}
Function.prototype.bind = function(obj) {
var method = this,
temp = function() {
return method.apply(obj, arguments);
};
return temp;
}
var whatTheysays;
whatTheysays = aboutMe.bind (_president, ["Hello My Country,"]); // "Hello My Country, I am the president"
alert(whatTheysays);
whatTheysays = aboutMe.bind (_secretary, ["Hello My Officer,"]); // "Hello My Officer, I am the secretary of president"
alert(whatTheysays);
</script>
???????????? ? bind() ??? Function object ?? ? prototype propety ??? ???????? ?????????????? ???? ???????????? ? ?????????? ? ?????? (method) ??????? ??? ?????????????????????? aboutMe.bind(_president) ????????? ?????? Javascript ? bind() ??????????? execution context ???????? ???????????? ???????? this ??? ???? aboutMe ??? ??????????????? ????? ??? prarmeter ??????? obj ??? _president ?????????????????? ??????????????? :D?
???? ????? ? ???????? method ??? ?????? ??????????? method ????? this ??? ???????? ???????? ???? this ? aboutMe() ??? ????? ???????? ?????????? function ??? ?????????????????? ???????????????????? method ??? scope chain ??????? ???? ???????????? ????????? this ??? ??????? ? ???????? ??????? function ???? ??? ????????? ????????? this ? ???? ????? ???????? (local context) ?????????????? aboutMe() ??????????????? ??????? function ?? ????????? ???????? ??????????????
??????????????????? ?? ????????? temp ? closure (????????????????????? ????????????????) ????? bind() ??? ??????? ? ???? (return ) ?????????? aboutMe ??? _president object ???????? ?????????????????? ?????? ????????? ????? execution context ??? ??????????? ? ??????? ???????????? ???????????????????
??? ???????????? ? event handler ????? ????????????? ??????????????????? :D ? ????? ???????? ????? event handler ??? ????? ????????????????
<script type="text/javascript">
var the_button;
function aboutMe(answer)
{
this._answer = answer;
this.tell = function() {
alert(this._answer);
}
}
Function.prototype.bind = function(obj) {
//alert(this + 'this in bind');
//alert(arguments[0].the_answer);
var method = this,
temp = function() {
return method.apply(obj, arguments);
};
return temp;
}
function addhandler()
{
var _president = new aboutMe(“I am the president.”),
var the_button = document.getElementById('thebutton');
the_button.onclick = _ president.tell();
//alert(this + ' this in addhandler');
the_button.onclick = _president.tell.bind(_president);
}
</script>
……
……
<BODY onload="javascript:addhandler();" BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#FF0000" VLINK="#800000" ALINK="#FF00FF" BACKGROUND="?">
<button ID="theButton">Click Me</button>
</BODY>
</HTML>
??? html ??? body ?? ? onload ??? addhandler() ??? ???? ?????????????????????????
????? ?????????????????????????.?
?????????????????? ??????????????(akela)Augest21, 2007 12:11 pm