Web front end Development Engineer programming Ability Growth path (1)

Background

If you are just entering the Web front-end research and development field, want to try this pond water how deep, read this article;
If you are doing a two or three -year web product front-end research and development, confused to find ways to improve, read this article;
If you are the front-end development experts in the 45, no problem can be rare to live your lonely master, to see this article it;

　　Web front-end research and development engineer, in the country is a Chaoyang career, since 07-08 years formally has this profession, but also only three or four years of time. There is no formal education in this field, there is no theoretical guide to the internal system, and almost all the people who are engaged in this profession are self-taught by themselves. Self-taught, a hard bumpy road, I also walked all the way. Since 2002, contact Web front-end research and development has been 9 years, and now look back, during the many detours. Push already and people, if can let those who later take a few detours, symplectic very very!

Objective

The so-called genius, is just faster than ordinary people to master the skills, to complete the work, as long as you find the right direction, and supplemented by enough time, you can set foot on the other side of success.

This article divides the Web front-end development programming ability to divide eight levels, each level has enumerated the corresponding characteristic and the broken level promotion method, hoped each person looks at this article the classmate first accurate localization own level (do not take your current ability the highest point, but with your present ability the mid-range and the grade compares, lest many detours) , refer to break through the method of breaking.

The so-called level is just an attitude when you are faced with a need: to be able to complete, to be completed perfectly, to be completed more than expected. The pursuit of a perfect attitude to a solid programming skills, that is your programming level.

Remember impatient air dry, level enough, that level of things naturally understand. Understanding is the understanding, not understanding also does not matter, quiet heart to, put time just.

I. "Getting Started"

Able to solve some of the problem levels. There are certain foundations (such as the most common HTML tags and their properties, events, methods, the most common CSS properties, basic JavaScript programming capabilities), and the ability to accomplish some simple web front-end research and development needs.

For example, delete a character specified in a string.

var str= "Www.baidu.com/?page"; Str=str.replace ('? Page ', ""); alert (str); str= Str.substring (0,str.indexof ("/")); alert (str);

First of all, do not criticize the code of the right and wrong rigorous, after all, each programmer has such a process; second, these two pieces of code in this instance there is no big fault, there may be flaws, but can solve the problem (delete the specified character), this is the level of characteristics.

Let me give you an example:

//The calculation system is currently the day of the weekvarstr = "";varWeek =NewDate (). GetDay ();if(Week = = 0) {str= "Today is Sunday";} Else if(Week = = 1) {str= "Today is Monday";} Else if(Week = = 2) {str= "Today is Tuesday"; } Else if(Week = = 3) {str= "Today is Wednesday"; } Else if(Week = = 4) {str= "Today is Thursday"; } Else if(Week = = 5) {str= "Today is Friday"; } Else if(Week = = 6) {str= "Today is Saturday"; }//or something better .varSTR1 = "Today is the Week";varWeek =NewDate (). GetDay ();Switch(week) { Case0: str1+ = "Day";  Break;  Case1: str1+ = "One";  Break;  Case2: str1+ = "Two";  Break;  Case3: str1+ = "three";  Break;  Case4: str1+ = "Four";  Break;  Case5: str1+ = "Five";  Break;  Case6: str1+ = "Six";  Break;} alert (str); alert (str1);

The Getting Started stage is the only way for every programmer to get started and you're on the road. The so-called "teacher leads the door, the practice relies on individual", with this "primer" foundation, oneself can grope forward.

"The way of Advanced"

read through each of the methods/properties in the coding help manuals such as JavaScript, HTML, CSS, and more ! Only the foundation will be played well, the future road can go smoothly. Refer to these help documents and try to write a flawless code.

These coding documents are recommended not only in the beginning of the improvement period, you should look at each stage of the break, the most basic things are often the most power, and sometimes can bring you unexpected gains.

Two. "Boarding Hall"

Be able to solve the problem correctly. Whether you are searching the Web, or by transforming some of the finished code (Jquery/dojo/ext/yui) cases, you can complete the requirements without errors.

Also take the "string clipping" code above as an example:

var str= "Www.baidu.com/?page"; Str=str.replace (/?page/, ""); alert (str) ;

Just solving the problem is no longer a problem for the "Don" stage, and the solution given at this level cannot be flawed. Take this code example:The first parameter of the Replace method can support a string, but the best type is a regular expression;

var New Array ("Day", "one", "two", "three", "four", "five", "six"); var New Date (). GetDay (); var str = "Today is the Week" + A[week];alert (str);

Compared to the "entry-level" code, whether it is from the code, code efficiency, code elegance, code thinking, "Hall" level of this date processing code is much better.

　　"The way of Advanced"

Although this stage can give the correct solution, but not necessarily the best solution. How can we get the best solution? The first is to accumulate a variety of solutions that can solve the requirements, and then validate each scenario to choose the best one in these scenarios. Therefore, the stage of the advanced Road is "traveling thousands of miles, read the book", the accumulation of various requirements of the various solutions.

You can go through all the FAQs and posts in the Professional forum (blue ideal, hassle-free,CSDN), and you can open the search engine and make all the search results exhaustive. Build your own test environment to validate the code: try to figure out the intent of each piece of code to compare the differences between each piece of code. These two roads will allow you to quickly complete the primitive accumulation, and when you face most of the requirements to be able to say these questions I have done before, then you will be in the right order.

　　Three. "Break-ins"

The strongest code, knowing all the solutions that can solve the requirements, can choose to use the best solution to meet the requirements. This level is basically the code main in product development programming. Given the one-trick, strokes are the trick.

In the example above, can you tell the difference between 1, 2,3, and apply to that environment?

var str= "Www.baidu.com/?page"; // 1, String clipping str.substring (0, Str.indexof ("? Page")); // 2, the regular expression str.replace (/?page/, ""); // 3. String splitting, merging str.split ("? Page"). Join ("");

There are many ways to solve problems, but for programmers, you should choose the best. The above code "regular expression" is the best in terms of code, from the Efficiency of code execution: "String clipping" the highest ("regular expression" in chrome is the most efficient),split method The most, and from the extensibility, the "regular expression" method is optimal. The specific use of that option depends on the specific requirements environment.

During the "break-in" phase, the programmer should be able to answer with certainty: My code is the best code for this requirement.

"Today is the day of the week" for example, "Hall" level of code you dare to say is the best code?

// The calculation system is currently the day of the week var str = "Today is the Week" + "Day 123456". CharAt (new date (). GetDay ());

Compare the "Hall" level of the sample code, above this code to give you how to feel? What programmers are after is perfection. The "break-in" level pursues the perfection of every trick.

FromWeb front-end programming, through 2 years of effort, a lot of people can reach this level, but a large part of the people's programming ability also stopped here. or limited to the demand of the product, or limited to the urgency of the time required for development, or limited to human inertia, can perfectly solve the current demand is enough.

Due to the long-term technical platform period, the technical improvement, usually this level of engineers will be relatively dry. A little technical, or the pursuit of personal breakthroughs, or the pursuit of product differentiation to bring freshness, or just want to change the mood, so many of this level of engineers will often change the company.

Rashness

Do not think you can write a beautiful code and complacent;
Do not think that others "honorific" you a "hero" you will be "heroes";
Don't think that you have accumulated some of the proud code has become a framework development.

The details determine success or failure, and good solutions do not guarantee eventual success. Also take "delete specified string" as an example, the original string from the format should be a URL link, after the removalof "pn=0", the end of the left a tail "?" If the original string is "http://www.xxx.com/?pn=0&a=1", after removing "pn=0" ? and the & two symbols stick together, this is the obvious bug.

　　"The way of Advanced"

This stage of the Advanced Road is: Do not impatient air, you are no longer required to take the lead, but you take the demand to go. Pay attention to the details and note the details that are not in the current requirements: differences in code performance, differences in running platforms (browsers), implicit expansion of requirements, backward compatibility of code, and so on.

Read through the Html/css/javascript help document a few more times .

I recommend this level of engineer to do a Webtreeview control, requires the total node volume of 10,000 or so smooth operation, your promotion is in the process of encoding this control.

Web front end Development Engineer programming Ability Growth path (1)