Web前端项目-交互式3D魔方【附源码】
交互式3D魔方
3D魔方游戏是一款基于网页技术的三维魔方游戏。它利用HTML、CSS和JavaScript前端技术来实现3D效果，并在网页上呈现出逼真的魔方操作体验。
运行效果：
一：index.html
<!DOCTYPE html>
<html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"><link rel="stylesheet" type="text/css" href="styles/cube.css"><link rel="stylesheet" type="text/css" href="styles/doodle2.css"><link rel="stylesheet" type="text/css" href="styles/certificate2.css"><script charset="utf-8" src="scripts/tween.r12.js"></script><script charset="utf-8" src="scripts/three.js"></script><script charset="utf-8" src="scripts/cuber.min.js"></script></head><body><div id="bg"></div><div id="container"></div><div id="fail"><img src="media/static-cube.png"/><div id="upgradeText" class="bubble fadeTransition"><div class="upgradetext">To play, please use a supported hardware configuration and the latest version of one of these browsers:</div><br><a class="upgradetext" href="https://www.google.com/chrome/browser/" target="_blank">Chrome</a><br><a class="upgradetext" href="https://www.mozilla.org/firefox" target="_blank">Firefox</a><br><a class="upgradetext" href="https://www.apple.com/safari" target="_blank">Safari</a><br><span class="pointerleft SPRITE_carrot_down_2x"></span></div></div><div id="uipanel" class="fadeTransition" style="display:none"><div id="movecounter">0</div><div id="buttonpanel"><div id="sharebubble" class="fadeTransition" style="opacity:0"><input id="shareshortlink" type="text" value="google.com/doodles" readonly/><div id="sharegplus" class="bubbleicon SPRITE_google_plus_64_2x"></div><div id="sharefacebook" class="bubbleicon SPRITE_facebook_64_2x"></div><div id="sharetwitter" class="bubbleicon SPRITE_twitter_64_2x"></div><div id="shareemail" class="bubbleicon SPRITE_email_64_2x"></div></div><div id="uibuttons"><div id="sharebutton" class="bubbleicon SPRITE_share_64_2x"></div><div id="helpbutton" class="bubbleicon SPRITE_help_64_2x"></div><div id="searchbutton" class="bubbleicon SPRITE_search_64_2x"></div></div></div><div id="helpbubble" class="bubble" style="display:none"><span class="pointerup SPRITE_carrot_grey_up_2x"></span><div id="helpimage" class="one"></div><div id="helptext" class="helptext"></div><div id="helpnext" class="helptext"></div><span class="pointerdown SPRITE_carrot_down_2x"></span><br></div></div><script charset="utf-8" src="scripts/iecss3d.js"></script><script charset="utf-8" src="scripts/ierenderer.js"></script><script charset="utf-8" src="scripts/deviceMotion.js"></script><script charset="utf-8" src="scripts/locked.js"></script><script charset="utf-8" src="scripts/textBox.js"></script><script charset="utf-8" src="scripts/ResizeableTextBox.3.js"></script><script charset="utf-8" src="scripts/divBox.js"></script><script charset="utf-8" src="scripts/frames.js"></script><script charset="utf-8" src="scripts/certificate.js"></script><script charset="utf-8" src="scripts/main3.js"></script></body>
</html>
二：styles包
（1）cube.css
.cube {width: 100%;height: 100%;
}
.faceLabel {display: none;position: absolute;font-size: 60px;text-align: center;text-shadow: 0 0 24px rgba( 0, 0, 0, 0.3 );color: #FFF;
}
.cube .cubelet {width: 1em;height: 1em;position: absolute;box-sizing: border-box;
}
.cube .face {position: absolute;width: 1em;height: 1em;background-color: #000;text-align: center;-webkit-backface-visibility: hidden;-moz-backface-visibility:hidden;-o-backface-visibility:hidden;backface-visibility:hidden;padding: 0.05em;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;
}
.cube .face.faceIntroverted { background-color: #000; }
.cube .face.faceTransparent { background-color: transparent; }
.purty .face { opacity: 0.5; }
.purty .face.faceFront { background-color: #FFF; }
.purty .face.faceUp { background-color: #E87000; }
.purty .face.faceRight { background-color: #3D81F6; }
.purty .face.faceDown { background-color: #DC422F; }
.purty .face.faceLeft { background-color: #009D54; }
.purty .face.faceBack { background-color: #F5B400; }
.cube .face > .wireframe {display: none;position: absolute;width: 140px;height: 140px;background-color: rgba( 255, 255, 255, 0.05 );
}
.cube .sticker {width: 100%;height: 100%;background-color: #F0F;border-radius: 0.1em;text-align: center;
}
.cube .sticker.red { background: #DC422F; }
.cube .sticker.white { background: #F3F3F3; }
.cube .sticker.blue { background: #3D81F6; }
.cube .sticker.green { background: #009D54; }
.cube .sticker.orange { background: #E87000; }
.cube .sticker.yellow { background: #F5B400; }
.cube .sticker.stickerLogo {background-size: 100% 100%;background-repeat: none;
}
.cube .face > .id {display: none;position: absolute;z-index: 1000;width: 90%;height: 90%;font-size: 1em;line-height: 0.9em;text-align: center;color: #000;
}
.cube .face > .id > .underline {border-bottom: 1px solid #000;
}
.cube .face.faceIntroverted > .id {color: #FEFEFE;
}
.cube .face.faceIntroverted > .id > .underline {border-bottom: 1px solid #FEFEFE;
}
.cube .face > .text {display: none;position: absolute;z-index: 2000;width: 100%;height: 100%;text-align: center;color: #FFF;font-size: 1em;line-height: 1em;
}
（2）certificate2.css
#certName, #certSolved{width: 1100px;color: #DC422F;padding: 20px;font-family: "Rubik One", Arial, sans-serif;font-size: 180px;text-align: center;line-height: .97em;text-transform: uppercase;
}
#certDate, #certMovesHeader, #certTimeHeader, #certName, #certSolved, #certTimeNumber, #certMovesNumber{-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: default;
}
#certDate{width: 1000px;color: #000;padding: 20px;font-family: "Rubik One", Arial, sans-serif;text-transform: uppercase;font-size: 110px;text-align:center;line-height: .8em;
}
#certMovesHeader, #certTimeHeader {width: 1000px;color: #000;padding: 20px;font-family: "Rubik One", Arial, sans-serif;text-transform: uppercase;font-size: 90px;text-align: center;line-height: .8em;
}
#certTimeNumber, #certMovesNumber{width: 1000px;color: #3D81F6;padding: 20px;font-family: "Rubik One", Arial, sans-serif;font-size: 180px;text-align: center;line-height: 1.0em;text-transform: uppercase;
}
#certLarryName, #certErnoName{width: 1000px;color: #FF6C00;padding: 20px;font-family: "Rubik One", Arial, sans-serif;font-size: 80px;text-align: center;line-height: 1.0em;
}
#larrySignature{width: 1000px;height: 300px;background-size: 700px 210px;background-repeat:no-repeat;background-position:center;
}
#ernoSignature{width: 1000px;height: 300px;background-size: 700px 210px;background-repeat:no-repeat;background-position:center;
}
#lineLeft, #lineRight{width: 1000px;height: 10px;background-color: #000;display: inline-block;background-repeat: no-repeat;background-position: 100px 100px;
}
.logoFace {width: 100%;height: 100%;display: block;z-index: 1000;background-size: 100% 100%;background-repeat: none;top: 0px;right: 1px;position: absolute;-webkit-transform: rotate(90deg);-moz-transform: rotate(90deg);-o-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg);
}
.faceDown .logoFace.ie{-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);-o-transform: rotate(180deg);-ms-transform: rotate(180deg);transform: rotate(180deg);
}
.cube .sticker.red { background: #DC422F; }
.cube .sticker.white { background: #FFFFFF; }
.cube .sticker.blue { background: #3D81F6; }
.cube .sticker.green { background: #009D54; }
.cube .sticker.orange { background: #FF6C00; }
.cube .sticker.yellow { background: #FDCC09; }
.textBox_IE{z-index: 10;top:0;
}
（3）doodle2.css
html {height: 100%;
}
body {background-color: #fff;display: inline;font-family: arial, sans-serif;font-size: 13px;height: 100%;line-height: 40px;margin: 0;vertical-align: baseline;-moz-user-select:-moz-none;-ms-user-select:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;
}
#fail {position: absolute;display: none;top: 50%;left: 50%;margin-left: -288px;margin-top: -117px;
}
@media not screen and (-webkit-transform-3d){#container {visibility: hidden;}#fail {display: block;}
}
#bg {background-color: #fff;font-family: arial, sans-serif;font-size: 13px;height: 100%;line-height: 40px;margin: 0;position: absolute;width: 100%;
}
.graydient {background: #000;background: -moz-radial-gradient(center,ellipse cover,#444 0%,#000000 90%);background: -webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,#444),color-stop(90%,#000000));background: -webkit-radial-gradient(center,ellipse cover,#444 0%,#000000 90%);background: -o-radial-gradient(center,ellipse cover,#444 0%,#000000 90%);background: -ms-radial-gradient(center,ellipse cover,#444 0%,#000000 90%);background: radial-gradient(ellipse at center,#444 0%,#000000 90%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444',endColorstr='#000000',GradientType=1 );
}
.grey {background: #555;
}
.white {background: #FFF;
}
#container {cursor: pointer;height: 100%;overflow: hidden;width: 100%;position:relative;
}
.text {font-size: 200;
}
.text.textDown { color: #DC422F; }
.text.textBack { color: #F5B400; }
.text.textRight { color: #3D81F6; }
.shadow {pointer-events: none;position: absolute;width: 120px;height: 120px;background: black;box-shadow: 0 0 100px 80px black;opacity: 0.06;-webkit-transition: opacity 1s;-moz-transition: opacity 1s;-ms-transition: opacity 1s;-o-transition: opacity 1s;transition: opacity 1s;
}
.bubble {background: #fff;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;border: 3px solid black;bottom: 4px;line-height: normal;padding: 16px;position: absolute;right: 0;
}
.mobile .bubble {background: #000;border: 2px solid #555;bottom: auto;position: absolute;right: 0;top: 44px;
}
.pointerdown {bottom: -15px;display: block;height: 15px;margin: 0 0 0 -5px;outline: none;position: absolute;right: 42px;
}
.mobile .pointerdown {display: none;
}
.pointerup {display: none;
}
.mobile .pointerup {top: -15px;display: block;outline: none;position: absolute;right: 68px;
}
.bubbleicon {cursor: pointer;display: inline-block;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;
}
.fadeTransition {-webkit-transition: opacity 250ms;-moz-transition: opacity 250ms;-ms-transition: opacity 250ms;-o-transition: opacity 250ms;transition: opacity 250ms;
}
#sharebubble {display: inline-block;vertical-align: bottom;
}
#uibuttons {display: inline-block;
}
#buttonpanel {line-height: normal;position: absolute;right: 0;
}
#shareshortlink {background: #ddd;border: none;color: #fff;font-weight: bold;margin: 0;outline: none;padding: 10px;vertical-align: top;width: 120px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;
}
#shareshortlink::-ms-clear {display: none;
}
#uipanel {bottom: 40px;height: 32px;margin: 0 auto;opacity: 0;position: relative;width: 572px;
}
.mobile #uipanel {bottom: auto;top: 4px;right: 4px;width: 100%;position: absolute;
}
#movecounter {bottom: -8px;color: #ddd;display: inline-block;font-family: "Rubik One";font-size: 14pt;left: 0;position: absolute;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: default;
}
.mobile #movecounter {bottom: auto;top: 0;color: #555;padding: 4px 20px;font-size: 16pt;font-weight: bold;
}
.upgradetext, .helptext {font-family: arial;font-size: 12pt;font-weight: bold;width: 120px;color: #999;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: default;
}
.helptext {font-family: arial;font-size: 12pt;font-weight: bold;width: 200px;color: #999;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: default;
}
#helpnext {padding-top: 10px;cursor: pointer;
}
#helpimage{width:160px;height: 123px;background-size:160px 123px;
}
#helpimage.one{width:140px;height: 100px;background-size:140px 100px;
}
#helpimage.two{width:140px;height: 100px;background-size:140px 100px;
}
注意：
由于博客字数限制，本篇文章所展示的代码并不全面，仅可供参考之用。关于本项目的完整代码及其素材已上传至资源，大家自行去下载就好
相关文章：
Web前端项目-交互式3D魔方【附源码】
交互式3D魔方 3D魔方游戏是一款基于网页技术的三维魔方游戏。它利用HTML、CSS和JavaScript前端技术来实现3D效果，并在网页上呈现出逼真的魔方操作体验。 运行效果： 一：index.html <!DOCTYPE html> <html><head><…...
视频格式转换avi格式怎么弄？分享视频转换方法
视频格式转换avi格式怎么弄？AVI作为一种广泛支持的视频格式，能够在多种设备和播放器上顺畅播放，确保我们的视频内容能够无障碍地分享给朋友或上传至各大平台。其次，AVI格式通常具有较好的兼容性，能够避免格式转换过程中…...
UniRx 入门
Reactive X 是 Reactive Extensions 的缩写，一般简写为 Rx，最初是 LINQ 的一个扩展，由微软的团队开发，Rx 是一个编程模型，目标是提供一致的编程接口，帮助开发者更方便的处理异步数据流，支持大部…...
简单游戏制作——飞行棋
控制台初始化 int w 50; int h 50; ConsoleInit(w, h); static void ConsoleInit(int w, int h) {//基础设置//光标的隐藏Console.CursorVisible false;//舞台的大小Console.SetWindowSize(w, h);Console.SetBufferSize(w, h); } 场景选择相关 #region 场景选择相关 //声…...
等保一体机
等保一体机是面向等保场景推出的合规型安全防护产品。基于“一个中心，三重防护”的设计理念，通过内置全面、多样的安全能力，为政府、医疗、教育、企业等中小型客户提供快速合规、按需赋能的一站式等保合规解决方案。 等保一体机要求管理网络和…...
什么是寄存器文件（Register File）？
寄存器文件（Register File）是计算机系统中用于存储处理器操作数的小型、快速的存储单元集。它在 CPU 内部，提供极高的访问速度，通常用于存储临时数据、操作数和指令执行过程中的中间结果。 寄存器文件的组成和特点 寄存器集&…...
6月15号作业
使用手动连接，将登录框中的取消按钮使用第二中连接方式，右击转到槽，在该槽函数中，调用关闭函数 将登录按钮使用qt4版本的连接到自定义的槽函数中，在槽函数中判断ui界面上输入的账号是否为"admin"࿰…...
零基础入门学用Arduino 第三部分（三）
重要的内容写在前面： 该系列是以up主太极创客的零基础入门学用Arduino教程为基础制作的学习笔记。个人把这个教程学完之后，整体感觉是很好的，如果有条件的可以先学习一些相关课程，学起来会更加轻松，相关课程有数字电路…...
Trusty qemu + android环境搭建详细步骤
下载源码 mkdir trusty cd trusty repo init -u https://android.googlesource.com/trusty/manifest -b master repo sync -j32 编译 ./trusty/vendor/google/aosp/scripts/build.py generic-arm64 查看编译结果 ls build-root/build-generic-arm64/lk.bin 安装运行依赖 …...
杀戮尖塔游戏
Java 你正在玩策略卡牌杀戮尖塔游戏，轮到你出牌，手里N张攻击卡，每张都需要花金币coust[i]和获得伤害dmager[i]。 最多花3金币能造成的最大伤害是多少？ class Solution{public int calc(int[] cost, int[] dmager, N){int[][] db …...
Kubernetes (K8s) 和 Spring Cloud 的区别
Kubernetes (K8s) 和 Spring Cloud 是两种常用的云原生技术，它们在微服务架构和云计算领域中扮演着重要的角色。尽管两者都有助于开发和部署微服务，但它们的功能和目标存在显著差异。本文将详细讨论 Kubernetes 和 Spring Cloud 的区别，从它们…...
定个小目标之刷LeetCode热题（21）
这是道技巧题，利用了 （num - 1）% n 计算下标的形式来将数组元素与数组索引产生映射关系，代码如下，可以看下注释 class Solution {public List<Integer> findDisappearedNumbers(int[] nums) {int n nums.lengt…...
Oracle 打开钱包 ORA-28368: cannot auto-create wallet
ORA-28368: cannot auto-create wallet 开启钱包抱错，看下钱包信息 SQL> select * from v$encryption_wallet;WRL_TYPE -------------------- WRL_PARAMETER -------------------------------------------------------------------------------- STATUS ------…...
【麒麟虚拟机】NetworkManager没有运行
麒麟V10 建linux麒麟虚拟机，发现，网络没有配置 提示，NetworkManager没有运行。编辑联接也不能配置 解决方法，在终端输入命令： sudo systemctl start NetworkManager 启动以后，编辑连接选自动以太网&…...
vue之一键部署的shell脚本和它的点.bat文件、海螺AI、ChatGPT
MENU 前言vite.config.ts的配置deploy文件夹的其他内容remote.shpwd.txtdeploy.bat 前言 1、在src同级新建deploy.bat文件； 2、在src同级新建deploy文件夹，文件夹中新建pwd.txt和remote.sh文件； 3、配置好后，直接双击deploy.bat文…...
pg和oracle的区别
1、从功能上来说pg要比oracle数据库弱。 2、pg不支持索引组织表。 pg和oracle的相似之处： 1、使用共享内存的进程结构，客户端与数据库服务器建立一个连接后，数据库服务器就启动一个进程为这个连接服务。这与mysql的线程模型不一样。 2、p…...
Docker：在DockerHub上创建私有仓库
文章目录 Busybox创建仓库推送镜像到仓库 本篇开始要学习在DockerHub上搭建一个自己的私有仓库 Busybox Busybox是一个集成了三百多个最常用Linux命令和工具的软件，BusyBox包含了很多工具，这里拉取该镜像推送到仓库中： 安装 apt install …...
框架的使用
什么是框架？ 盖房子，框架结构 框架结构就是房子主体，基本功能 把很多基础功能已经实现（封装了） 框架：在基础语言之上，对各种基础功能进行封装，方便开发者，提高开发效…...
Autosar-DEM诊断事件管理流程
文章目录 前言一、故障事件监控二、故障信息上报三、故障信息处理Event的使能条件四、故障信息存储五、故障系统降级关联文章：Autosar实践——DEM配置 前言 DEM全称“Diagnostic Event Management”，该模块是AUTOSAR架构中的BSW模块之一。谈到故障，我们首先会想到如何去监控…...
LabVIEW输送机动态特性参数监测系统
开发了一套基于LabVIEW软件和STM32F103ZET6单片机的带式输送机动态特性参数监测系统。该系统通过电阻应变式压力传感器和光电编码器实时采集输送带的张力和带速信息，通过5G模块将数据传输至上位机，实现数据的可视化处理与实时预警，有效提高输…...
绿色版DirectoryOpus功能强大且高度可定制的Windows文件管理器
Directory Opus（通常简称为DOpus）是一款功能强大且高度可定制的Windows文件管理器。它提供了许多超越Windows默认文件资源管理器（Explorer）的功能，使得文件和文件夹的管理变得更加高效和直观。以下是对Directory Opus的…...
Cocos Creator，Youtube 小游戏！
YouTube 官方前段时间发布了一则重磅通知，宣布平台旗下小游戏功能 Youtube Playables 正式登录全平台（安卓、iOS、网页），并内置了数十款精选小游戏。 Youtube Playables 入口： https://www.youtube.com/playables Coco…...
分层解耦
三层架构 controller:控制层，接收前端发送的请求，对请求进行处理，并响应数据， service:业务逻辑层，处理具体的业务逻辑。 dao:数据访问层(Data Access Object)(持久层)，负责数据访问操作，包括数…...
GenICam标准（六）
系列文章目录 GenICam标准（一） GenICam标准（二） GenICam标准（三） GenICam标准（四） GenICam标准（五） GenICam标准（六） 文章目录 系列文…...
JavaFX VBox
VBox布局将子节点堆叠在垂直列中。新添加的子节点被放置在上一个子节点的下面。默认情况下，VBox尊重子节点的首选宽度和高度。 当父节点不可调整大小时，例如Group节点，最大垂直列的宽度基于具有最大优选宽度的节点。 默认情况下，…...
xss+csrf项目实例
项目背景： 如下：我们是在一个类似文章管理系统的网站上面发现的该漏洞。我们将其运行在本地的phpstudy集成环境上面。 源码地址下载链接：https://pan.baidu.com/s/1MpnSAq7a_oOcGh4XgPE-2w 提取码：4444 考察内容： …...
速盾：cdn加速怎么计费？
CDN加速（Content Delivery Network）是一种将内容部署在全球多个节点上，通过就近访问提供服务的技术。它可以加快网站的速度和可靠性，同时减轻源服务器的负载。在使用CDN加速服务时，计费是一个重要的问题，下…...
Vue3 中 props 与 emit 用法
在 Vue3 中，props 和 emit 的用法有所改变，主要的变化在于它们现在都通过 setup 函数来访问和使用。 props: props 用于父组件向子组件传递数据。在 setup 函数中，props 是一个参数，我们可以通过它访问到父组件传入的所有 prop 值…...
【python】如何import 另一个路径下的py文件内容
目录结构： ├─common │ └─config.py └─own_module │ └─run.py问题描述： 如何在run.py 中调用 config.py 中的函数或类？ 解决办法： import os import sys # 为了引用自定义模块，可临时将module的绝对路径…...
C/C++ Adaline自适应线性神经网络算法详解及源码
个人名片 🎓作者简介：java领域优质创作者 🌐个人主页：码农阿豪 📞工作室：新空间代码工作室（提供各种软件服务） 💌个人邮箱：[2435024119qq.com] 📱…...
网站伪静态/西安企业网站seo
Activity、Service和线程应该是Android编程中最常见的几种类了，几乎大多数应用程序都会涉及到这几个类的编程，自然而然的，也就会涉及到三者之间的相互通信，本文就试图简单地介绍一下这三者通信的方式。想…...
个人介绍网页模板免费下载/绍兴百度seo
在Ext的使用过程中，偶然发现了一个有趣的问题， 和大家共享一下。 先看如下代码：// 定义一个基类， 一个数组成员arr，和一个空函数init var BaseClass Ext.extend(Ext.util.Observable, {arr: [],init: Ext.emptyFn });…...
公司网站里面页面链接怎么做/赣州seo推广
网站建设流程 网站建设包括域名注册查询、网站策划、网页设计、网站功能、网站优化技术、网站内容整理、网站推广、网站评估、网站运营、网站整体优化、网站改版等，这里用一张图概括了网站建设的基本流程，需要的朋友可以参考下， 常见的前端产…...
qq教程网站源码/网络营销是什么意思
数据库中char、varchar、varchar2、nvarchar之间的关系 分类： 数据库 varchar varchar2 nvarchar2012-12-06 11:27 2849人阅读 评论(0) 收藏 举报数据库中的char型，用于存储定长字符串，效率比varchar要稍高，但是，占用空…...
个人网站做捐赠发布违法吗/如何提交百度收录
RBAC-基于角色的访问控制 在Kubernetes中，最佳的做法是，为特定的应用程序的服务帐户授予角色,确保应用程序在指定的范围内运行。要详细了解服务帐户权限请阅读官方Kubernetes文档. Bitnami写了一个在集群中配置RBAC的指导，可让你了解RBAC基础…...
东莞网站建设服务/营销新闻
在函数内部，可以调用其他函数。如果一个函数在内部调用自身本身，这个函数就是递归函数。举个例子，我们来计算阶乘n! 1 * 2 * 3 * ... * n，用函数fact(n)表示，可以看出：fact(n) n! 1 x 2 x 3 x ... x (n-…...