這篇文章主要介紹了JavaScript的AOP編程,以實例形式分析了javascript面向切面編程的實現技巧,具有一定參考借鑒價值,需要的朋友可以參考下

本文實例講述了JavaScript之AOP編程。分享給大家供大家參考。具體如下：

1. /* 
2. // aop({options}); 
3. // By: adamchow2326@yahoo.com.au 
4. // Version: 1.0 
5. // Simple aspect oriented programming module 
6. // support Aspect before, after and around 
7. // usage: 
8. aop({ 
9. context: myObject, // scope context of the target function. 
10. target: "test", // target function name 
11. before: function() { // before function will be run before the target function 
12. console.log("aop before"); 
13. }, 
14. after: function() { // after function will be run after the target function 
15. console.log("aop after"); 
16. }, 
17. around: function() { // around function will be run before and after the target function 
18. console.log("aop around"); 
19. } 
20. }); 
21. */ 
22. var aop = (function() { 
23. var options = {}, 
24. context = window, 
25. oFn, 
26. oFnArg, 
27. targetFn, 
28. targetFnSelector, 
29. beforeFn, 
30. afterFn, 
31. aroundFn, 
32. cloneFn = function(Fn) { 
33. if (typeof Fn === "function") { 
34. return eval('[' +Fn.toString()+ ']')[0]; 
35. } 
36. return null; 
37. }, 
38. checkContext = function() { 
39. if (options.context) { 
40. context = options.context; 
41. } 
42. if (typeof context[(options.target).name] === "function") { 
43. targetFnSelector = (options.target).name; 
44. targetFn = context[targetFnSelector]; 
45. } 
46. else if (typeof context[options.target] === "function") { 
47. targetFnSelector = options.target; 
48. targetFn = context[targetFnSelector]; 
49. } 
50. if (targetFn) { 
51. oFn = cloneFn(targetFn); 
52. oFnArg = new Array(targetFn.length); 
53. return true; 
54. } 
55. else { 
56. return false; 
57. } 
58. }, 
59. run = function() { 
60. context[targetFnSelector] = function(oFnArg) { 
61. if (aroundFn){ 
62. aroundFn.apply(this, arguments); 
63. } 
64. if (beforeFn){ 
65. beforeFn.apply(this, arguments); // 'this' is context 
66. } 
67. oFn.apply(this, arguments); 
68. if (afterFn){ 
69. afterFn.apply(this, arguments); // 'this' is context 
70. } 
71. if (aroundFn){ 
72. aroundFn.apply(this, arguments); 
73. } 
74. }; 
75. }; 
76. return function(opt){ 
77. if (opt && typeof opt === "object" && !opt.length) { 
78. options = opt; 
79. if (options.target && checkContext()) { 
80. if (options.before && typeof options.before === "function") { 
81. beforeFn = options.before; 
82. } 
83. if (options.after && typeof options.after === "function") { 
84. afterFn = options.after; 
85. } 
86. if (options.around && typeof options.after === "function") { 
87. aroundFn = options.around; 
88. } 
89. run(); 
90. } 
91. } 
92. }; 
93. })(); 
94. // test examples 
95. // ----------------- aop modify global function ---------------// 
96. function test(name, age) { 
97. console.log("test fn. name = " + name + " age: " + age); 
98. } 
99. aop({ 
100. target: "test", 
101. before: function() { 
102. console.log("aop before"); 
103. }, 
104. after: function() { 
105. console.log("aop after"); 
106. }, 
107. around: function() { 
108. console.log("aop around"); 
109. } 
110. }); 
111. // run 
112. test("adam", 6); 
113. // ----------------- aop test modify method in an object ---------------// 
114. var myobj = { 
115. myName: "testName", 
116. sayName: function() { 
117. console.log(this.myName); 
118. }, 
119. childObj: { 
120. age: 6, 
121. say: function() { 
122. console.log(this.age); 
123. } 
124. } 
125. }; 
126. aop({ 
127. context: myobj, 
128. target: "sayName", 
129. before: function() { 
130. console.log("aop before say name = " + this.myName); 
131. }, 
132. after: function() { 
133. console.log("aop after say name = " + this.myName); 
134. }, 
135. around: function() { 
136. console.log("aop around say name = " + this.myName); 
137. } 
138. }); 
139. // run 
140. myobj.sayName(); 
141. aop({ 
142. context: myobj.childObj, 
143. target: "say", 
144. before: function() { 
145. console.log("aop before say name = " + this.age); 
146. }, 
147. after: function() { 
148. console.log("aop after say name = " + this.age); 
149. }, 
150. around: function() { 
151. console.log("aop around say name = " + this.age); 
152. } 
153. }); 
154. myobj.childObj.say(); 

希望本文所述對大家的javascript程序設計有所幫助。