How to compile a Javascript script Library

Source: Internet
Author: User

After four years of web development, I have accumulated more or less JavaScript scripts. For example, to restrict input to scripts that only allow numbers to be input, and press enter to automatically go to the next control, which is equivalent to the function of the tab key. Because the results of JavaScript numeric operations are often not what we want, the floating point number (addition, subtraction, multiplication, division) function is also required. When you have javascript requirements, you often find the required scripts on the internet, copy them directly to the aspx file, or create a Javascript file, and then add references.
<SCRIPT src = "jscript. js" type = "text/JavaScript"> </SCRIPT>. After all, there is not much demand for Javascript, so it does not take a lot of effort to learn.

Recently, my company's projects are not busy, so I am busy with Script learning in my spare time. There is a popular jquery script library on the Internet, and a large numberArticleDiscuss how to use it. As I personally know, JavaScript is the same as regular expressions and is often forgotten. You will soon forget the knowledge you have learned. Especially the content related to the application, such as how to use pagemethods, how to implement the short callback of the customer, and how to use JavaScript to call web services, which has been used many times in the project, but once asked by colleagues, it's still vague, so it's hard to say why. One way I can do is to make a demo, make a good demo of various effects, put them together in different categories, and then search for them when using them, which can save a lot of time. Another method is as mentioned in this Article. Sort out the JavaScript code and make it a common script library for reuse. The meaning of sorting is to adjust the function appropriately so that it can not only meet the needs of the current project, but also meet the needs of future projects, another implication is to standardize the naming and organizational structure, and write a sampleCodeIt is convenient to use. Sometimes I download many practical JavaScript scripts on the Internet, but I forget to download the test scripts. I don't know how to use them. It's better to search for them online.

Javascript is defined as an object-based scripting language. On the one hand, it is based on DOM object models and methods in DOM objects. On the other hand, JavaScript does not have the inheritance and polymorphism characteristics of object-oriented languages. ASP. NET Ajax extends JavaScript so that we can organize JavaScript scripts in an object-oriented manner. My main job here is encapsulation, which encapsulates the existing Code to facilitate reuse next time. There are two ways to organize the existing JavaScript code library.
I will take the addition and subtraction operations in the controversial floating-point operations in Javascript as an example to see how to encapsulate them.
Javascript Style
Function math (){}
// Addition
Math. Prototype. Add = function (arg1, arg2 ){
VaR R1, R2, M;
Try {R1 = arg1.tostring (). Split (".") [1]. Length} catch (e) {R1 = 0}
Try {r2 = arg2.tostring (). Split (".") [1]. Length} catch (e) {r2 = 0}
M = math. Pow (10, math. Max (R1, R2 ))
Return (arg1 * m + arg2 * m)/m
}
// Subtraction
Math. Prototype. subtraction = function (arg1, arg2 ){
VaR R1, R2, M, N;
Try {R1 = arg1.tostring (). Split (".") [1]. Length} catch (e) {R1 = 0}
Try {r2 = arg2.tostring (). Split (".") [1]. Length} catch (e) {r2 = 0}
M = math. Pow (10, math. Max (R1, R2 ));
N = (r1> = R2 )? R1: R2;
Return (arg1 * m-arg2 * m)/m). tofixed (N );
}
Call Method
VaR math = new math ();
VaR result = math. Add (2.0, 4.0 );
Ajax Style
Type. registernamespace ("utility ");
Utility. Math = function (Larg, rarg)
{
This. _ left = larg;
This. _ Right = rarg;
}
Utility. Math. Prototype =
{

// addition function
Add: function ()
{< br> var R1, R2, M;
try {R1 = left. tostring (). split (". ") [1]. length} catch (e) {R1 = 0}
try {r2 = right. tostring (). split (". ") [1]. length} catch (e) {r2 = 0}
M = math. pow (10, math. max (R1, R2)
return (left * m + right * m)/m
}< br> // subtraction function
subtraction: function () {
var R1, R2, m, n;
try {R1 = left. tostring (). split (". ") [1]. length} catch (e) {R1 = 0}
try {r2 = right. tostring (). Split (". ") [1]. length} catch (e) {r2 = 0}
M = math. pow (10, math. max (R1, R2);
N = (r1> = R2 )? R1: R2;
return (left * m-right * m)/m ). tofixed (n);
}< BR >}< br> // registration class
utility. math. registerclass ("utility. math ");
then, you can call the following method as needed
var math = new utility. math (2.0, 4.2);
var result = math. add ();

Using the two methods proposed above, you can easily encapsulate common JavaScript to reduce duplication.
The above name has a problem, because math is a built-in JavaScript type that is used to handle various mathematical operations. In order to run the above JavaScript-style script, you have to replace the class name with another name, such as mathhelper. ASP. NET Ajax also extends the six types of JavaScript, including array, Boolean, date, error, object, and string.

If there is a method, it may be said that you should publish your own JavaScript library to satisfy the public's taste. It is difficult to practice this method only: there are reasons for tight project time, busy working on projects every day, and there are also reasons for getting familiar with javascript when there is time to sort out this.
In order to make my class library difficult, I found some suggestions on writing a javascript library on the Internet.
There is an article named "Building a javascript library". Before I wrote this article, I 'd like to see how he wrote it. However, the webpage keeps prompting that the file is being loaded and cannot be viewed. I really want to know how foreigners write the same theme.
Another article is also wonderful. Its name is rules for JavaScript library authors.
Http://dean.edwards.name/weblog/2007/03/rules/
I will translate it for your reference.
1. Do not use the method too cumbersome.
2 avoid using object. Prototype
3. Do not over-Scale
4. comply with the standards.
5 align with excellent JavaScript creators
6. Keep the variable value flexible. 7. Manage the memory to avoid Memory leakage.
8. Avoid browser-related hack
9 keep the class library concise
10. Make the class library predictable. For example, although you haven't checked the document, you should be able to guess that math is used to process the content related to mathematical operations.
11. Additional Rules: documents; Use as many namespaces as possible to organize code to make it easy to remember;

My level is very general.ProgramMember. Therefore, do not ask me for code. I gave it to you, and you still have to spend time reading it. Besides, my code does not have any documentation. What can you do if you don't understand it. In this case, why not sort out the Javascript you have on hand. Besides, you have actually used the Javascript in your hand, and you are certainly familiar with it. Don't recommend jquery either. It's not my purpose.
My goal is to teach you how to organize the existing Javascript script library and make good use of the existing resources.

 

Test code downloads:/files/jamesli2015/Math-Test.zip

Add a common problem: if Javascript is put into an external file, the system may prompt "the object cannot be found" during the runtime"
This problem is caused by file encoding. Make the encoding of Javascript script files consistent with that of HTML pages.
Click "file -->" Save as "to save the two as the same encoding format.

We recommend that you use vs ide To write scripts, so that you can use the smart prompt support provided by IDE.

If you use Dreamweaver to write scripts, it also provides smart prompts

 

Download the test code:/files/jamesli2015/javascript.zip

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.