总体的思路（可能有的翻译不是很准确，主要看代码思维）
总体架构：
1. 申明变量，并且赋值canvas，3d各种值的默认值（默认值具体看canvas 3D API,可以参考的网址: https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext）
varREVISION ='88';
var MOUSE = {
LEFT:0,MIDDLE:1,RIGHT:2};
var CullFaceNone =0;
var CullFaceBack =1;
var CullFaceFront =2;
var CullFaceFrontBack =3;
var FrontFaceDirectionCW =0;
var FrontFaceDirectionCCW =1;
var BasicShadowMap =0;
var PCFShadowMap =1;
var PCFSoftShadowMap =2;
var FrontSide =0;
var BackSide =1;
var DoubleSide =2;
var FlatShading =1;
var SmoothShading =2;
var NoColors =0;
var FaceColors =1;
var VertexColors =2;
var NoBlending =0;
var NormalBlending =1;
var AdditiveBlending =2;
var SubtractiveBlending =3;
var MultiplyBlending =4;
var CustomBlending =5;
var AddEquation =100;
var SubtractEquation =101;
var ReverseSubtractEquation =102;
var MinEquation =103;
var MaxEquation =104;
var ZeroFactor =200;
var OneFactor =201;
var SrcColorFactor =202;
var OneMinusSrcColorFactor =203;
var SrcAlphaFactor =204;
var OneMinusSrcAlphaFactor =205;
var DstAlphaFactor =206;
var OneMinusDstAlphaFactor =207;
var DstColorFactor =208;
var OneMinusDstColorFactor =209;
var SrcAlphaSaturateFactor =210;
var NeverDepth =0;
var AlwaysDepth =1;
var LessDepth =2;
var LessEqualDepth =3;
var EqualDepth =4;
var GreaterEqualDepth =5;
var GreaterDepth =6;
var NotEqualDepth =7;
var MultiplyOperation =0;
var MixOperation =1;
var AddOperation =2;
var NoToneMapping =0;
var LinearToneMapping =1;
var ReinhardToneMapping =2;
var Uncharted2ToneMapping =3;
var CineonToneMapping =4;
var UVMapping =300;
var CubeReflectionMapping =301;
var CubeRefractionMapping =302;
var EquirectangularReflectionMapping =303;
var EquirectangularRefractionMapping =304;
var SphericalReflectionMapping =305;
var CubeUVReflectionMapping =306;
var CubeUVRefractionMapping =307;
var RepeatWrapping =1000;
var ClampToEdgeWrapping =1001;
var MirroredRepeatWrapping =1002;
var NearestFilter =1003;
var NearestMipMapNearestFilter =1004;
var NearestMipMapLinearFilter =1005;
var LinearFilter =1006;
var LinearMipMapNearestFilter =1007;
var LinearMipMapLinearFilter =1008;
var UnsignedByteType =1009;
var ByteType =1010;
var ShortType =1011;
var UnsignedShortType =1012;
var IntType =1013;
var UnsignedIntType =1014;
var FloatType =1015;
var HalfFloatType =1016;
var UnsignedShort4444Type =1017;
var UnsignedShort5551Type =1018;
var UnsignedShort565Type =1019;
var UnsignedInt248Type =1020;
var AlphaFormat =1021;
var RGBFormat =1022;
var RGBAFormat =1023;
var LuminanceFormat =1024;
var LuminanceAlphaFormat =1025;
var RGBEFormat = RGBAFormat;
var DepthFormat =1026;
var DepthStencilFormat =1027;
var RGB_S3TC_DXT1_Format =2001;
var RGBA_S3TC_DXT1_Format =2002;
var RGBA_S3TC_DXT3_Format =2003;
var RGBA_S3TC_DXT5_Format =2004;
var RGB_PVRTC_4BPPV1_Format =2100;
var RGB_PVRTC_2BPPV1_Format =2101;
var RGBA_PVRTC_4BPPV1_Format =2102;
var RGBA_PVRTC_2BPPV1_Format =2103;
var RGB_ETC1_Format =2151;
var LoopOnce =2200;
var LoopRepeat =2201;
var LoopPingPong =2202;
var InterpolateDiscrete =2300;
var InterpolateLinear =2301;
var InterpolateSmooth =2302;
var ZeroCurvatureEnding =2400;
var ZeroSlopeEnding =2401;
var WrapAroundEnding =2402;
var TrianglesDrawMode =0;
var TriangleStripDrawMode =1;
var TriangleFanDrawMode =2;
var LinearEncoding =3000;
var sRGBEncoding =3001;
var GammaEncoding =3007;
var RGBEEncoding =3002;
var LogLuvEncoding =3003;
var RGBM7Encoding =3004;
var RGBM16Encoding =3005;
var RGBDEncoding =3006;
var BasicDepthPacking =3200;
var RGBADepthPacking =3201;
2. 申明gezhon
//事件触发类
function EventDispatcher() {}
Object.assign(EventDispatcher.prototype,{} )
// vector4对象
functionVector4( x,y,z,w ){}
Object.assign(Vector4.prototype,{} );
// Math对象
var _Math ={};
// 视椎体对象
functionFrustum( p0,p1,p2,p3,p4,p5 ) {}
Object.assign(Frustum.prototype,{})
// 剪裁对象
function WebGLClipping(){}
// 矩阵Matrix4
function Matrix4(){}
Object.assign(Matrix4.prototype,{})
// vector3
function Vector3( x,y,z ){}
Object.assign(Vector3.prototype,{})
// Sphere 对象
function Sphere( center,radius ){}
Object.assign(Sphere.prototype,{})
//plane 对象
functionPlane( normal,constant ){}
Object.assign(Plane.prototype,{})
//Quaternion
function Quaternion( x,y,z,w){};
Object.assign(Quaternion,{});
Object.assign(Quaternion.prototype,{});
Object.assign(Quaternion.prototype,
{})
// box3 盒子范围
function Box3( min,max ){}
Object.assign(Box3.prototype,{})
// Matrxix3 矩阵
functionMatrix3(){}
Object.assign(Matrix3.prototype,{})
// WebGLExtensions 对 webgl进行扩展
function WebGLExtensions(){};
// webgl 工具扩展
function WebGLUtils( gl,extensions ){}
// webgl状态扩展
function WebGLState( gl,extensions,utils ){}
// webgl viewport设置类
function WebVRManager( renderer ){}
// shadowMap 阴影投射类
function WebGLShadowMap( _renderer,_objects,maxTextureSize ){}
// 透视相机类
function PerspectiveCamera( fov,aspect,near,far ){};
PerspectiveCamera.prototype= Object.assign( Object.create(Camera.prototype,),{});
//普通相机类
function Camera(){}
Camera.prototype= Object.assign( Object.create(Object3D.prototype),{})
// object3d 对象
var object3DId =0;
function Object3D(){}
Object3D.DefaultUp=newVector3(0,1,0);
Object3D.DefaultMatrixAutoUpdate=true;
Object.assign(Object3D.prototype,EventDispatcher.prototype,{})
// 欧拉角
function Euler( x,y,z,order ){}
Euler.RotationOrders= ['XYZ','YZX','ZXY','XZY','YXZ','ZYX'];
Euler.DefaultOrder='XYZ';
Object.defineProperties(Euler.prototype,{})
Object.assign(Euler.prototype,{})
// 图层
function Layers(){}
Object.assign(Layers.prototype,{})
// ArrayCamera 相机的应用方法
function ArrayCamera( array ){}
ArrayCamera.prototype= Object.assign( Object.create(PerspectiveCamera.prototype),{})
// Vector2 类
function Vector2( x,y ){}
Object.defineProperties(Vector2.prototype,{})
Object.assign(Vector2.prototype,{})
// 深度材质类
function MeshDepthMaterial( parameters ){}
MeshDepthMaterial.prototype= Object.create(Material.prototype);
MeshDepthMaterial.prototype.constructor=MeshDepthMaterial;
MeshDepthMaterial.prototype.isMeshDepthMaterial=true;
MeshDepthMaterial.prototype.copy=function( source ){}
// 材质类
var materialId =0;
function Material(){}
Object.assign(Material.prototype,EventDispatcher.prototype,{})
// 方向材质类
function MeshDistanceMaterial( parameters ){}
MeshDistanceMaterial.prototype= Object.create(Material.prototype);
MeshDistanceMaterial.prototype.constructor=MeshDistanceMaterial;
MeshDistanceMaterial.prototype.isMeshDistanceMaterial=true;
MeshDistanceMaterial.prototype.copy=function( source ){}
//webGl对象类
functionWebGLRenderer( parameters ){}
Object.assign(WebGLRenderer.prototype,{})
Object.defineProperties(WebGLRenderer.prototype,{})
这就是整体的架构，后面我们会一个类一个类学习，解析，可以能力有限，希望对大家有利！！！下一节 ：EventDispatcher