Javascript Variable scope

Hi,

I am a beginner in Javascript and just trying out some experiments.

Say I declare two javascript files and reference both in my xhtml files.

HTML File:

test1.js

test2.js

My firebug is saying that 'items' is not declared.

Just curious though, I think I have read something like Javascript Lexical Structure wherein you can use a function or variable even though it is declared later.

Does this mean that each js file has its own bounds only.

Sorry if my question looks dumb, just want to understand.

It works fine for me. I get an alert with the text Hello.

Ooops.. I think I understand now.

I made a mistake in my post,
it should be:

test1.js

test2.js

So javascript reads the test1.js since it is declared first at the html file then proceeds to reading the test2.js first.

But upon reading test1.js it executes the alert statements but cannot find the items variable so thats why my firebug fires up an error.

So if my understanding is correct, does lexical scope applies only to codes within the same javascript file?

I'm not sure how lexical (static) scope applies to your test code. Scripts are evaluated how the come into the page. If you define the same variable twice, the one eval'd last is what you get.

mark reyes wrote:So if my understanding is correct, does lexical scope applies only to codes within the same javascript file?

Regardless of where it is loaded from, all script shares the same scope.

Hi Greg/Bear,

Thanks. I think I got confused with the lexical scope related to functions in javascript.

Will continue to read more on this topic.

Hi,

The other post that I created was locked by a moderator. I thought it was a different question so I created a new topic for that. Sorry.

This topic is about variable declaration and this one is a follow up question about function declaration.

I have this confusion about creating javascript functions. Hope you could enlighten me out.

Say I created a named function:

So I can call it like this since named functions becomes the property of the global object which is the window object

Now, I have made some experiment to help me understand further.

Say I have this HTML.

test1.js has this code:

test2.js has this code:

Now here is where I got confused, when I run this code in firefox, firebug is telling me that sayHi is undefined.

I thought named functions are created before any code is executed. Also I thought only anonymous functions are created during the parsing of the script.

Can you help me out if I miss some basic concept?

Thanks and sorry again for the double post.

Because the first file runs before the second file is loaded.
It is like trying to write with a pen before you put the pen in your hand.

Eric

Hi,

Because the first file runs before the second file is loaded.
It is like trying to write with a pen before you put the pen in your hand

The google search that I have read so far has never mention anything about this. Most of the functions and examples are contained in only one source file.

I just tried to experiment by making two separate javascript source files since I have seen so many web sites with multiple declaration of javascript link files.
(I had to blame my curiosity for that...)

My first assumption is that the javascript engine will read through all the source files.

Now I know thats how it behaves. Thanks again and sorry for the double post.

It does read through all of the files. The function has be instantiated [I think that is the right word, my brain is not on yet], but it has not been assigned to.

For example run this code and take note the difference between a, b and c.

a - Defined before it is used

b - Defined after it is used

c - Never defined

Eric

Hi Sir,

Got the idea now. Thanks for the additional example.