5 Styles of Javascript design

1. Process-oriented programming

<script>/*Start and Stop animations using functions. */ function startanimation () {//... . }function  stopanimation () {//.... }</script>

2. Creating Class Objects

<script>/*Anim class.*/varAnim =function () {//...}; Anim.prototype.start=function () {//...}; Anim.prototype.stop=function () {//...};/*Usage.*/varMyanim =NewAnim (); Myanim.start ();//...myanim.stop ();</script>

3. Encapsulating a class in a declaration

<script>/**/varfunction  () {//...  =function  () {//...  function  () {//... }}; </script>

4. Add a method

<script>/*Add a method to the Fuction object which can be used to declare methods.*//*Function.prototype.method is used to add a new method to a class, two parameters. First argument: A string that represents the name of the new method; the second argument: a function to use as a new method*/Function.prototype.method=function(name, FN) { This. prototype[name] =fn;}/*Anim Class,with methods created using a convenience method.*/varAnim =function () {//...}; Anim.method (' Start ',function () {//...}); Anim.method (' Stop ',function () {//...});</script>

5. Chained calls

<script>/*This version allows the calls to be chained.*/Function.prototype.method=function(name, FN) { This. prototype[name] =fn;return  This;//returns this so that it can be called by a chain. };/*Anim Class,with methods created using a convenience method and chaining.*/varAnim =function () {//...}; Anim.method (' Start ',function () {//...}). Method (' Stop ',function () {//... });</script>

5 Styles of Javascript design