آشنایی با مفاهیم شیء گرایی در جاوا اسکریپت #2
نویسنده: مهران ر
تاریخ: ۱۳۹۲/۱۰/۰۸ ۱۸:۵
آدرس: www.dntips.ir
| مطالب | ۳۶۹۴ |
| نویسندگان | ۲۷۶ |
| گروههای مطالب | ۱۰۲۴ |
| نقشههای راه | ۱۱۹ |
| دورهها | ۱۴ |
| اشتراکها | ۱۷۹۱۴ |
function testScope() {
var myTest = true;
if (true) {
var myTest = "I am changed!"
}
alert(myTest);
}
testScope(); // will alert "I am changed!" function testScope() {
var myTest = true;
if (true) {
var myTest = "I am changed!"
}
alert(myTest);
}
testScope(); // will alert "I am changed!"
alert(myTest); // will throw a reference error, because it doesn't exist outside of the function <script type="text/javascript">
// a globally-scoped variable
var a = 1;
// global scope
function one()
{
alert(a);
}
// local scope
function two(a)
{
alert(a);
}
// local scope again
function three()
{
var a = 3;
alert(a);
}
// Intermediate: no such thing as block scope in javascript
function four()
{
if (true)
{
var a = 4;
}
alert(a); // alerts '4', not the global value of '1'
}
// Intermediate: object properties
function Five()
{
this.a = 5;
}
// Advanced: closure
var six = function ()
{
var foo = 6;
return function ()
{
// javascript "closure" means I have access to foo in here,
// because it is defined in the function in which I was defined.
alert(foo);
}
}()
// Advanced: prototype-based scope resolution
function Seven()
{
this.a = 7;
}
// [object].prototype.property loses to [object].property in the lookup chain
Seven.prototype.a = -1; // won't get reached, because 'a' is set in the constructor above.
Seven.prototype.b = 8; // Will get reached, even though 'b' is NOT set in the constructor.
// These will print 1-8
one();
two(2);
three();
four();
alert(new Five().a);
six();
alert(new Seven().a);
alert(new Seven().b);
</Script> var obj = {
value: 0,
increment: function() {
this.value+=1;
}
};
obj.increment(); //Method invocation <script type="text/javascript">
var value = 500; //Global variable
var obj = {
value: 0,
increment: function() {
this.value++;
var innerFunction = function() {
alert(this.value);
}
innerFunction(); //Function invocation pattern
}
}
obj.increment(); //Method invocation pattern
<script type="text/javascript">
Result : 500 <script type="text/javascript">
var value = 500; //Global variable
var obj = {
value: 0,
increment: function() {
var that = this;
that.value++;
var innerFunction = function() {
alert(that.value);
}
innerFunction(); //Function invocation pattern
}
}
obj.increment();
<script type="text/javascript">
Result : 1 var Dog = function(name) {
//this == brand new object ({});
this.name = name;
this.age = (Math.random() * 5) + 1;
};
var myDog = new Dog('Spike');
//myDog.name == 'Spike'
//myDog.age == 2
var yourDog = new Dog('Spot');
//yourDog.name == 'Spot'
//yourDog.age == 4 var createCallBack = function(init) { //First function
return new function() { //Second function by Constructor Invocation
var that = this;
this.message = init;
return function() { //Third function
alert(that.message);
}
}
}
window.addEventListener('load', createCallBack("First Message"));
window.addEventListener('load', createCallBack("Second Message")); myFunction.apply(thisContext, arrArgs); myFunction.call(thisContext, arg1, arg2, arg3, ..., argN);
var contextObject = {
testContext: 10
}
var otherContextObject = {
testContext: "Hello World!"
}
var testContext = 15; // Global variable
function testFunction() {
alert(this.testContext);
}
testFunction(); // This will alert 15
testFunction.call(contextObject); // Will alert 10
testFunction.apply(otherContextObject); // Will alert "Hello World” var o = {
i : 0,
F : function() {
var a = function() { this.i = 42; };
a();
document.write(this.i);
}
};
o.F();
Result :0 var p = {
i : 0,
F : function() {
var a = function() { this.i = 42; };
a.apply(this);
document.write(this.i);
}
};
p.F();
Result :42 var q = {
i: 0,
F: function F() {
var that = this;
var a = function () {
that.i = 42;
}
a();
document.write(this.i);
}
}
q.F();