代码复用
源码下载本节课的代码是在上一课的代码基础上进行抽象,把多次使用的代码结构抽象出来,单独用一个函数表达.
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循环结构单独拉出来,构建一个新的函数,供其它函数调用, 实际的工程中,会出现函数的层层嵌套。主要目的是为了压缩代码,压缩代码对于人而言,编写阅读方便,对于网络传输而言,可以提高网页加载速度,对于浏览器而言可以加快 解析、渲染速度。很多程序也不是刚一开始就是很好地进行了代码重用,往往都是随着程序的开发,代码越来越复杂,这时候通常会抽取出来相同的程序结构。
上面的代码有些并没有重用,只是把循环结构单独独立了出来,大家只要有代码重用的意识,本节课的目的就达到了。