![JS数组[2, 5, 2, 5, 10, 12],如何循环打印 （2, 5, 10, 12） 不要打印重复的值，这个循环怎么写。](/aiimages/JS%E6%95%B0%E7%BB%84%5B2%2C+5%2C+2%2C+5%2C+10%2C+12%5D%2C%E5%A6%82%E4%BD%95%E5%BE%AA%E7%8E%AF%E6%89%93%E5%8D%B0+%EF%BC%882%2C+5%2C+10%2C+12%EF%BC%89+%E4%B8%8D%E8%A6%81%E6%89%93%E5%8D%B0%E9%87%8D%E5%A4%8D%E7%9A%84%E5%80%BC%EF%BC%8C%E8%BF%99%E4%B8%AA%E5%BE%AA%E7%8E%AF%E6%80%8E%E4%B9%88%E5%86%99%E3%80%82.png)
Threejs受众面比较广，是封装了webgl的一些底层用法，让初学者更容易上手；例如绘制一个立方体，使用webgl原生api可能要写50行代码，包括构建坐标点，顶点组织、着色器等信息；在threejs里面可能只要一句代码就可以构建(实际上也是调用webgl原生api)，只是做了更大粒度的封装
Cesium受众面相对较小，是Gis相关的，也是基于WebGL开发的，它主要是三维地球相关的js库，可以展示二维地图服务(百度高德)、倾斜摄影模型；还可以在上面做一些三维分析，可以参考http://cesium.xin
可能很多同学会发现，学习Three.js的API非常容易，但是真正理解API的作用却非常难。其实让大家感到难的并不是Three.js本身，而是Three.js背后所隐藏的3D图形学知识。本系列Three.js源码解读文章，会帮你一边补齐3D图形学的基础知识，一边真正理解到Three.js的实现原理，知其然，知其所以然。
Object3D是ThreeJS中大部分物体的基类，它包含了物体的位移，旋转，缩放，以及各个物体父子关系的js实现。选取Object3D几个重要的属性做解释：
一个3D对象往往由多个父子对象组成，父对象的位移, 旋转, 缩放会传递给所有的子对象。
this.parent指向父对象，this.children包含了所有的子对象。
通过 add 为物体添加子对象。需要注意的是，如果该子对象有其他的父对象，会先解除子对象和旧的父对象的父子关系，然后将子对象添加到新的父对象中。
this.matrix表示物体自身的本地形变，this.matrixWorld表示物体的全局形变。当物体没有父对象时，全局形变就是本地形变。
为什么对象组合这么重要呢？看下面的例子：
这两个立方体共同组成了一个3D对象，下面的立方体为底座，上面的立方体为操作臂。当底座转动的时候，操作臂会同样转动，所以操作臂的形变会传递给底座。当操作臂旋转时，底座不会被影响。
这里，底座就是操作臂的父对象。只要简单的将底座的全局形变(this.parent.matrixWorld)和操作臂的本地形变(this.matrix)相乘，就能得到操作臂的最终形变。是不是很方便？
3D物体的位移，旋转，缩放都可以通过矩阵表示。其中，旋转除了通过矩阵，还可以通过欧拉角和四元数表示。
Object3D的rotation代表物体旋转的欧拉角表示，quaternion代表了四元数表示，他们是3D物体统一旋转的不同数学表达方式。(矩阵，欧拉角，四元数表示旋转
onRotationChange , onQuaternionChange 这两个回调用于同步欧拉角和四元数，保证他们代表着相同的旋转角度。
3D交互一个很大一部分工作量是需要在物体的本地空间( this.matrix )和世界空间( this.matrixWorld )进行坐标转换。
用three.js展示3D模型是需要具备JS开发能力的。如果不具备JS开发能力，那就只能使用基于WebGL（或three.js）的制作平台或软件，就像使用Blender、3DMax那样直接画，这样的平台/软件不多，BlenderForWeb是一个，还有一个交互式三维创作平台，直接画就可以做出下图的效果，特别是支持定义交互。
