日期:2014-05-16  浏览次数:20326 次

高级js教程,转国外一个教程
http://www.sergiopereira.com/articles/advjs.html 写道
?

Hey, I didn't know you could do that

If you are a web developer and come from the same place I do, you have probably used quite a bit of Javascript in your web pages, mostly as UI glue.

Until recently, I knew that Javascript had more OO capabilities than I was employing, but I did not feel like I needed to use it. As the browsers started to support a more standardized featureset of Javascript and the DOM, it became viable to write more complex and functional code to run on the client. That helped giving birth to the AJAX phenomena.

As we all start to learn what it takes to write our cool, AJAXy applications, we begin to notice that the Javascript we used to know was really just the tip of the iceberg. We now see Javascript being used beyond simple UI chores like input validation and frivolous tasks. The client code now is far more advanced and layered, much like a real desktop application or a client-server thick client. We see class libraries, object models, hierarchies, patterns, and many other things we got used to seeing only in our server side code.

In many ways we can say that suddenly the bar was put much higher than before. It takes a heck lot more proficiency to write applications for the new Web and we need to improve our Javascript skills to get there. If you try to use many of the existing javascript libraries out there, like Prototype.js , Scriptaculous , moo.fx , Behaviour , YUI , etc you'll eventually find yourself reading the JS code. Maybe because you want to learn how they do it, or because you're curious, or more often because that's the only way to figure out how to use it, since documentation does not seem to be highly regarded with most of these libraries. Whatever the case may be, you'll face some kung-fu techniques that will be foreign and scary if you haven't seen anything like that before.

The purpose of this article is precisely explaining the types of constructs that many of us are not familiar with yet.

Related article

Prototype.js documentation

JSON

JavaScript Object Notation (JSON ,) is one of the new buzzwords popping up around the AJAX theme. JSON, simply put, is a way of declaring an object in javascript. Let's see an example right away and note how simple it is.

var myPet = { color: 'black', leg_count: 4, communicate: function(repeatCount){ 
for(i=0;i<repeatCount;i++) alert('Woof!');} };
			

Let's just add little bit of formatting so it looks more like how we usually find out there:

var myPet = {
	color: 'black', 
	legCount: 4, 
	communicate: function(repeatCount){
		for(i=0;i<repeatCount;i++)
			alert('Woof!');
	} 
};
			

Here we created a reference to an object with two properties (color and legCount ) and a method (communicate .) It's not hard to figure out that the object's properties and methods are defined as a comma delimited list. Each of the members is introduced by name, followed by a colon and then the definition. In the case of the properties it is easy, just the value of the property. The methods are created by assigning an anonymous function, which we will explain better down the line. After the object is created and assigned to the variable myPet , we can use it like this:

alert('my pet is ' + myPet.color);
alert('my pet has ' + myPet.legCount + ' legs');
//if you are a dog, bark three times:
myPet.communicate(3);
			

You'll see JSON used