代码复用

源码下载

  本节课的代码是在上一课的代码基础上进行抽象,把多次使用的代码结构抽象出来,单独用一个函数表达.

8        //矩阵乘法运算法则
9        function multiplication(a,b,c) {
10           for(let i = 0;i<4;i++){
11               let S = 0;
12               for(let j = 0;j<4;j++){
13                   S =S + a[i+4*j]*b[j];
14               }
15               c.push(S);
16           }
17       }
18   
19       function matrix(x,y,z,Tx,Ty,Tz) {
20           //声明一个4X4矩阵,每四个元素为一组,代表矩阵的一列
21           let arr1 = [1,0,0,0,  0,1,0,0,  0,0,1,0,  Tx,Ty,Tz,1];
22           //声明一个4X1矩阵,四个元素为一组,代表矩阵的一列
23           let arr2 = [x,y,z,1];
24           //容纳arr1矩阵数组和arr2矩阵数组的乘积
25           let arr3 = [];
26           multiplication(arr1,arr2,arr3);
27           return arr3;
28       }
29   
30       function matrix2(x,y,z,Tx,Ty,Tz) {
31           let arr1 = [Tx,0,0,0,  0,Ty,0,0,  0,0,Tz,0,  0,0,0,1];
32           let arr2 = [x,y,z,1];
33           let arr3 = [];
34           //调用multiplication
35           multiplication(arr1,arr2,arr3);
36           return arr3;
37       }
38       /*  调用函数matrix并把函数返回的结果赋值给result(返回的结果不是一个数,是一个数组,
39        所以是把返回数据的索引地址赋值给变量result)*/
40       let result = matrix2(1,1,1,0.5,0.5,0.5);
41       //循环遍历数组元素,显示在网页上
42       for(let i = 0;i<result.length;i++){
43           document.write(result[i]);
44           document.write("<br>");
45       }   

体验测试

  你可在第40代码随随机调用函数matrix或matrix2.

代码解析

  任意一个4X4矩阵和一个4X1矩阵相乘,它们的的for循环结构是相同的,只是矩阵的参数不同。很显然可以把for循环结构单独拉出来,构建一个新的函数,供其它函数调用, 实际的工程中,会出现函数的层层嵌套。主要目的是为了压缩代码,压缩代码对于人而言,编写阅读方便,对于网络传输而言,可以提高网页加载速度,对于浏览器而言可以加快 解析、渲染速度。很多程序也不是刚一开始就是很好地进行了代码重用,往往都是随着程序的开发,代码越来越复杂,这时候通常会抽取出来相同的程序结构。

  上面的代码有些并没有重用,只是把循环结构单独独立了出来,大家只要有代码重用的意识,本节课的目的就达到了。