JavaScript第一课

JavaScript 我们通常简化将其称为JS,它也是众多计算机编程语言的其中之一。

它拥有一项巨大的优势,它不需要服务器运行,也就是说他由客户的浏览器就可以运行。

了解它的第一点,就是需要了解它的变量与它的数据类型

那么他的数据类型又与Java的八个数据类型有所不同

 先来说基本数据类型

Java里面的浮点数类型数据(float)与整形数据(int)在JS内被整合成为了数值相数据类型(number)

布尔类型(boolean)与之一样

新加入了未定义数据类型(undefined)意为当一个变量被定义之后但是还没有被赋值时的数据状态

还有一个空数据类型(null)类型

还有三种引用数据类型

字符串类型(string)也一样

 Array 数组类型

对象类型 (Object)

了解完了数据类型完之后,接下来开始学数据类型的转换

js里面有两种数据类型的转换,一种是parseInt(),转换为整型数据,注意:这种数据类型转换不会四舍五入,它只能舍去小数点后的所有来取整。另一种转换则是parseFloat(),转换为浮点小数。

还有就是JS的注释了

在编程世界中,注释的存在是非常重要的,注释是那种可以帮助我们理解代码的一个重要的辅助工具,有了注释,哪怕很多年过去了,看一眼注释,你也可以瞬间回想起来这段代码是什么意思

那么JS是怎么注释的呢

"//"两个单斜杠,这就是一个单行的注释,当你只需要注释一行时,这就是你最好的选择。

多行的注释呢,则是"/*...........*/","/*"需要放在需要注释内容的最前面,"*/"就需要内容的最后面。当你注释需要很多行的时候,多行注释就派上了用场。

后面紧接着的就是变量了

先来说定义变量的格式:var 变量名=变量的值

当然变量名也是有具体的规范的:变量的名字可以是字母、数字、下划线、符号的结合 但是变量的首字符不能用数字,用数字的话虽然不会报错,但是并不符合变量的命名规范,还有就是:变量不能用关键字来命名。

变量也有三种不同的定义方式

一是先定义后赋值

二是在定义的同时赋值

三则是同时定义多个变量,不过要在变量之间用","来分隔开来。

最后,让我们来学习一个关键字 typeof

typeof的用处就是可以查看当前的数据类型。它可以直接加在需要查看数据类型的变量前面。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在搭建3D智慧园区、3D建筑、3D消防模拟以及web版3D和bim管理系统时,使用three.js是非常方便和实用的。以下是第四课的学习内容: ## 1. 管道的创建 在three.js中,可以通过THREE.CylinderGeometry类创建一个圆柱体,然后通过THREE.Mesh类将其转换为网格对象,最后添加到场景中。代码如下: ```javascript // 创建圆柱体 var geometry = new THREE.CylinderGeometry(1, 1, 10, 32); // 创建材质 var material = new THREE.MeshBasicMaterial({color: 0xff0000}); // 创建网格对象 var cylinder = new THREE.Mesh(geometry, material); // 添加到场景中 scene.add(cylinder); ``` 其中,CylinderGeometry类的构造函数参数依次为:顶部半径、底部半径、高度、分段数。 ## 2. 管道的弯曲 如果需要创建弯曲的管道,可以使用THREE.TubeGeometry类。该类需要传入一个路径曲线对象,表示管道的路径。代码如下: ```javascript // 创建路径曲线 var curve = new THREE.CatmullRomCurve3([ new THREE.Vector3(-10, 0, 0), new THREE.Vector3(-5, 5, 0), new THREE.Vector3(0, 0, 0), new THREE.Vector3(5, -5, 0), new THREE.Vector3(10, 0, 0) ]); // 创建管道 var geometry = new THREE.TubeGeometry(curve, 64, 1, 8, false); var material = new THREE.MeshBasicMaterial({color: 0xff0000}); var tube = new THREE.Mesh(geometry, material); scene.add(tube); ``` 其中,TubeGeometry类的构造函数参数依次为:路径曲线对象、分段数、管道半径、分段数、是否闭合。 ## 3. 管道的纹理 要给管道添加纹理,可以使用THREE.TextureLoader类加载纹理图片,并将其传入到材质对象中。代码如下: ```javascript // 加载纹理 var texture = new THREE.TextureLoader().load('textures/metal.jpg'); // 创建材质 var material = new THREE.MeshBasicMaterial({map: texture}); // 创建管道 var geometry = new THREE.CylinderGeometry(1, 1, 10, 32); var cylinder = new THREE.Mesh(geometry, material); scene.add(cylinder); ``` 其中,TextureLoader类的load方法可以加载图片,并返回一个纹理对象。MeshBasicMaterial类的map属性可以将纹理对象传入到材质中。 ## 4. 管道的动画 通过改变管道的位置、旋转等属性,可以实现管道的动画效果。例如,可以使用Tween.js库实现管道的平移动画。代码如下: ```javascript // 创建管道 var geometry = new THREE.CylinderGeometry(1, 1, 10, 32); var material = new THREE.MeshBasicMaterial({color: 0xff0000}); var cylinder = new THREE.Mesh(geometry, material); scene.add(cylinder); // 创建动画 var tween = new TWEEN.Tween(cylinder.position) .to({x: 10}, 1000) .easing(TWEEN.Easing.Quadratic.Out) .repeat(Infinity) .yoyo(true) .start(); // 更新动画 function animate() { requestAnimationFrame(animate); TWEEN.update(); renderer.render(scene, camera); } animate(); ``` 其中,使用Tween.js库创建一个Tween对象,并设置管道的位置属性为动画的目标属性。然后通过调用start方法启动动画。使用requestAnimationFrame方法更新动画。在每一帧中调用TWEEN.update方法更新Tween对象的属性。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值