node.js入门教程

Node是个啥?

  写个东西还是尽量面面俱到吧,所以有关基本概念的东西我也从网上选择性的拿了些下来,有些地方针对自己的理解有所改动,对这些概念性的东西有过了解的可选择跳过这段。

  1.Node 是一个服务器端 JavaScript 解释器,可是真的以为JavaScript不错的同学学习Node就能轻松拿下,那么你就错了,总结:水深不深我还不知道,不过确实不浅。

  2.Node 的目标是帮助程序员构建高度可伸缩的应用程序,编写能够处理数万条同时连接到一个物理机的连接代码。处理高并发和异步I/O是Node受到开发人员的关注的原因之一。

  3.Node 本身运行Google V8 JavaScript引擎,所以速度和性能非常好,看chrome就知道,而且Node对其封装的同时还改进了其处理二进制数据的能力。因此,Node不仅仅简单的使用了V8,还对其进行了优化,使其在各种环境下更加给力。(什么是V8 JavaScript 引擎?请“百度知道”)

  4.第三方的扩展和模块在Node的使用中起到重要的作用。下面也会介绍下载npm,npm就是模块的管理工具,用它安装各种 Node 的软件包(如express,redis等)并发布自己为Node写的软件包 。

安装Node

  在这简单说说在window7和linux两种环境下安装Node。安装的时候一定要注意Python的版本,多次因为Python版本的问题安装失败,建议2.6+的版本,低版本会出现Node安装错误,查询Python版本可在终端中输入:pyhton -v

  1.先介绍linux下的安装吧,Node在Linux环境下的安装和使用都非常方便,建议在Linux下运行Node,^_^...我使用的是Ubuntu11.04

   a.安装依赖包:50-100kb/s大概每个包一分钟就能下载安装完成


代码如下:

  sudo apt-get install g++ curl libssl-dev apache2-utils
  sudo apt-get install git-core

   b.在终端一步步运行一下命令:


代码如下:

  git clone git://github.com/joyent/node.git  
  cd node
  ./configure
  make  
  sudo make install

  安装顺利的话到这一步Node就算安装成功了,2M的网络用了共计12分钟。

  注:如果不用git下载也可以直接下载源码,不过这样下载安装需要注意Node版本问题。使用git下载安装是最方便的,所以推荐之。

2.在Windows下使用Cygwin安装Node,这个方式不太推荐,因为真的需要较长时间和较好的人品。我的系统是 win7旗舰版

  Cygwin是一个在windows平台上运行的unix模拟环境,下载地址:http://cygwin.com/setup.exe。

  下载好Cygwin后开始安装,步骤:

   a.选择下载的来源 - Install from Internet

   b.选择下载安装的根目录

   c.选择下载文件所存放的目录

   d.选择连接的方式

   e.选择下载的网站 - http://mirrors.163.com/cygwin

   f.麻烦就麻烦在这步,考验人品的时候到了。需要的下载安装时间不确定,反正需要比较长的时间(超过20分钟),偶尔会出现安装失败的情况。单击一下各个程序包前面的旋转箭头图标选择你想要的版本,选中时会出现了"x"号表示已经选中了该程序包。选择需要下载的程序包:

代码如下:

Devel包:
    gcc-g++: C++ compiler
    gcc-mingw-g++: Mingw32 support headers and libraries for GCC C++
    gcc4-g++: G++ subpackage
    git: Fast Version Control System – core files
    make: The GNU version of the ‘make' utility
    openssl-devel: The OpenSSL development environment
    pkg-config: A utility used to retrieve information about installed libraries
    zlib-devel: The zlib compression/decompression library (development)
  Editor包:vim: Vi IMproved – enhanced vi editor
  Python包:把Default切换成install状态即可
  Web包:
    wget: Utility to retrieve files from the WWW via HTTP and FTP
    curl: Multi-protocol file transfer command-line tool

上个截图,以下载zlib-devel为例:

上几步走完才算把环境搭建完成,可是现在还没有到安装Node,还需要在Cywgin的ASH模式下执行rebaseall,步骤如下:

   a. cmd命令行

   b. 进入cygwin安装目录下的bin子目录

   c. 运行ash进入shell模式

   d. ./rebaseall -v

   e. 没有错误就关闭命令行窗口
  好了,现在到下载安装Node了,启动Cygwin.exe后输入:


代码如下:

$ wget http://nodejs.org/dist/node-v0.4.12.tar.gz
  $ tar xf node-v0.4.12.tar.gz
  $ cd node-v0.4.12
  $ ./configure
  $ make
  $ make install

3.直接下载node.exe文件

  直接去nodejs.org下载,听说有不太稳定的问题,不过你假如只是想先在windows下了解Node,个人感觉这个方法比你装个Cygwin好很多。

  注:原本不太想写安装Node这段,可是为了这篇文章的全面性还是写了,没想到一写就是那么长一段了...茶几了

“Hello World” - 为什么每次见到这句心情都会小激动,不解...

  首先,创建个hello.js的文件,在文件中copy如下代码:


代码如下:

var http = require('http');
  http.createServer(function (req, res) {
    res.writeHead(200, {'Content-Type': 'text/plain'});
    res.end('Hello World\n');
  }).listen(1337, "127.0.0.1");
  console.log('Server running at http://127.0.0.1:1337/');

代码逻辑:

   a. 全局方法require()是用来导入模块的,一般直接把 require() 方法的返回值赋值给一个变量,在 JavaScript 代码中直接使用此变量即可 。require("http") 就是加载系统预置的 http 模块

   b. http.createServer 是模块的方法,目的就是创建并返回一个新的web server对象,并且给服务绑定一个回调,用以处理请求。

   c. 通过 http.listen() 方法就可以让该 HTTP 服务器在特定端口监听。

   d. console.log就不用多说了,了解firebug的都应该知道,Node实现了这个方法。

    注: 想了解具体细节请查看文档 cnodejs.org/cman/all.html#http.createServer

  接着运行Node服务器,执行hello.js代码,成功启动会看见console.log()中的文本。有图有真相:

npm的下载和使用

  除Node本身提供的API外,现在有不少第三方模块可极大的提高开发效率,npm就是Node的软件包管理器,可以用它安装所需软件包并发布自己为nodejs写的软件包。官网地址:npmjs.org

  安装只需要在终端写入一行代码:    


代码如下:

  curl http://npmjs.org/install.sh | sh

  npm安装node扩展包同样是一行代码:  


代码如下:

  npm install <包名>    //例:npm install express

  注:如果安装模块的过程中报域名错误的话,请清空缓存 >npm cache clean 或重启计算机即可。

理解Node的模块概念

  在Node中,不同的功能组件被划分成不同的模块。应用可以根据自己的需要来选择使用合适的模块。每个模块都会暴露一些公共的方法或属性。模块的使用者直接使用这些方法或属性即可,对于内部的实现细节就可以不用了解。除了Node本身提供的API外,开发人员也可以利用这个机制来将应用拆分成多个模块,以提高代码的可复用性。

  1.如何使用模块?

  在Node中使用模块是非常方便的,在 JavaScript 代码中可以直接使用全局函数 require() 来加载一个模块。

  在刚刚”Hello World"的例子中,require("http") 可以加载系统预置的 http 模块;模块名称以 "./" 开始的,如 require("./myModule.js") 用来加载与当前 JavaScript 文件同一目录下的 myModule.js 模块。

  2.自己如何开发模块?

  刚刚介绍使用require()导入模块的时候,模块名称以 "./" 开始的这种,就是自己开发的模块文件。需要注意的就是JS文件的系统路径。

  代码中封装了模块的内部处理逻辑,一个模块一般都会暴露一些公开的方法或属性给其他的人使用。模块的内部代码需要把这些方法或属性给暴露出来。

  3.来一套简单的例子。先创建一个模块文件如myModule.js,就一行代码

  console.log('Hi Darren.')
  然后创建一个test.js文件,导入这个JS文件,执行node看到结果

现在Node社区中已有不少第三方的模块,希望能有更多人通过学习Node,加入到这个大家庭中,为Node社区来添砖加瓦。先谢谢之,咱们继续。  

  4.来一个深点的例子。这个例子中将会针对 私有和共有 进行介绍。先创建一个myModule.js,代码如下:


代码如下:

  var name = "Darren";
  this.location = "Beijing";
  this.showLog = function(){
      console.log('Hi Darren.')
  };

  代码中出现了三种类型,分别是: 私用属性,共有属性和共有方法,再创建一个test.js,执行Node

结果高亮的地方很清楚的告诉我们,私有方法我们在模块以外是取不到的,所以是undefined。共有属性和共有方法的声明需要在前面加上 this 关键字。

Node能做什么和它的优势

  Node核心思想:  1.非阻塞;  2.单线程;  3.事件驱动。

  在目前的web应用中,客户端和服务器端之间有些交互可以认为是基于事件的,那么AJAX就是页面及时响应的关键。每次发送一个请求时(不管请求的数据多么小),都会在网络里走一个来回。服务器必须针对这个请求作出响应,通常是开辟一个新的进程。那么越多用户访问这个页面,所发起的请求个数就会越来越多,就会出现内存溢出、逻辑交错带来的冲突、网络瘫痪、系统崩溃这些问题。

  Node的目标是提供一种构建可伸缩的网络应用的方案,在hello world例子中,服务器可以同时处理很多客户端连接。

  Node和操作系统有一种约定,如果创建了新的链接,操作系统就将通知Node,然后进入休眠。如果有人创建了新的链接,那么它(Node)执行一个回调,每一个链接只占用了非常小的(内存)堆栈开销。   

  举一个简单的异步调用的例子,把test.js和myMydule.js准备好了,^_^。把以下代码拷贝到test.js中并执行:


代码如下:

var fs = require('fs');
  fs.readFile('./myModule.js', function (err, data) {
    if (err) throw err;
    console.log('successfully');
  });
  console.log('async');

所谓的异步,大家应该都能想得到运行时会先打先显示"async",再显示"successfully"。

  Node是无阻塞的,新请求到达服务器时,不需要为这个请求单独作什么事情。Node仅仅是在那里等待请求的发生,有请求就处理请求。

  Node更擅长处理体积小的请求以及基于事件的I/O。

  Node不仅仅是做一个Web服务的框架,它可以做更多,比如它可以做Socket服务,可以做比方说基于文件的,然后基于像一些比方说可以有子进程,然后内部的,它是一个很完整的事件机制,包括一些异步非注射的解决方案,而不仅仅局限在网络一层。同时它可能,即使作为一个Web服务来说,它也提供了更多可以深入这个服务内核、核心的一些功能,比方说Node使用的Http Agent,这块就是它可以更深入这个服务内核来去做一些功能。

Node事件流概念

  因为Node 采用的是事件驱动的模式,其中的很多模块都会产生各种不同的事件,可由模块来添加事件处理方法,所有能够产生事件的对象都是事件模块中的 EventEmitter 类的实例。代码是全世界通用的语言,所以我们还是用代码说话:


代码如下:

var events = require("events");
  var emitter = new events.EventEmitter();
  emitter.on("myEvent", function(msg) {
    console.log(msg);
  });
  emitter.emit("myEvent", "Hello World.");

简单的分析这段:

   1. 使用require()方法添加了events模块并把返回值赋给了一个变量

   2. new events.EventEmitter()这句创建了一个事件触发器,也就是所谓的事件模块中的 EventEmitter 类的实例

   3. on(event, listener)用来为某个事件 event 添加事件处理方法监听器

   4. emit(event, [arg1], [arg2], [...]) 方法用来产生事件。以提供的参数作为监听器函数的参数,顺序执行监听器列表中的每个监听器函数。

EventEmitter 类中的方法都与事件的产生和处理相关:

   1. addListener(event, listener) 和 on(event, listener) 这两个方法都是将一个监听器添加到指定事件的监听器数组的末尾

   2. once(event, listener) 这个方法为事件为添加一次性的监听器。该监听器在事件第一次触发时执行,过后将被移除

   3. removeListener(event, listener) 该方法用来将监听器从指定事件的监听器数组中移除出去

   4. emit(event, [arg1], [arg2], [...]) 刚刚提到过了。

  在Node中,存在各式各样不同的数据流,Stream(流)是一个由不同对象实现的抽象接口。例如请求HTTP服务器的request是一个流,类似于stdout(标准输出);包括文件系统、HTTP 请求和响应、以及 TCP/UDP 连接等。流可以是可读的,可写的,或者既可读又可写。所有流都是EventEmitter的实例,因此可以产生各种不同的事件。

可读流主要会产生以下事件:

1.data   当读取到流中的数据时,此事件被触发
2.end   当流中没有数据可读时,此事件被触发
3.error   当读取数据出现错误时,此事件被触发
4.close   当流被关闭时,,此事件被触发,可是并不是所有流都会触发这个事件。(例如,一个连接进入的HTTP request流就不会触发'close'事件。)
  还有一种比较特殊的 fd 事件,当在流中接收到一个文件描述符时触发此事件。只有UNIX流支持这个功能,其他类型的流均不会触发此事件。

  相关详细文档:http://cnodejs.org/cman/all.html#events_

强大的File System 文件系统模块

  Node 中的 fs 模块用来对本地文件系统进行操作。文件的I/O是由标准POSIX函数封装而成。需要使用require('fs')访问这个模块。所有的方法都提供了异步和同步两种方式。

  fs 模块中提供的方法可以用来执行基本的文件操作,包括读、写、重命名、创建和删除目录以及获取文件元数据等。每个操作文件的方法都有同步和异步两个版本。

  异步操作的版本都会使用一个回调方法作为最后一个参数。当操作完成的时候,该回调方法会被调用。而回调方法的第一个参数总是保留为操作时可能出现的异常。如果操作正确成功,则第一个参数的值是 null 或 undefined 。

  同步操作的版本的方法名称则是在对应的异步方法之后加上一个 Sync 作为后缀。比如异步的 rename() 方法的同步版本是 renameSync() 。下面列出来了 fs 模块中的一些常用方法,都只介绍异步操作的版本。

  test.js和myModule.js文件准备好了木?把下面这段代码copy到test.js中执行一次

代码如下:

 var fs = require('fs');
  fs.unlink('./myModule.js', function (err) {
    if (err) throw err;
    console.log('successfully deleted myModule.js');
  });

  如果没有报error,那么myModule.js就被删除了,就是这么简单


这只是一个简单的例子,感兴趣的话自己去多多尝试,实践出真理。由于篇幅原因就不多举例了。^_^

学习Node的总结:

  1.对于一个linux的命令和shell知识几乎为零的我来说,这段时间又学到了不少关于linux知识;vim真是一个强大的编辑器,不用鼠标的感觉真的很好;而且有一点对我来说很重要,在linux下编程很cool,尤其是在团队中都是使用windows的,装装更健康^_^。

  2.理解了服务端JavaScript的一个成功框架-Node,以及它的一些优势和使用的方式,这篇文章就是最好的总结,当然,这只会是一个开始。

一些想对大伙说的话:

  1. 在这我得打击一部分人的积极性。假如你对后台技术不够了解或者没接触过服务端语言,不知道I/O这些知识,没有后台处理流程这种概念,那么......Node并不是一门适合入门的服务端技术。为什么这么说:

   a.重点就是中文实例少,文章少,想系统的学习会比较麻烦,所以在使用过程中总有一种不成熟的感觉,当然主要还是因为我对它不熟悉所造成的。国内使用Node的公司确实不多,当然国外还是有不少了,从cnodejs.org截了一个图:

  3.对于没有进入那么梦想的公司其实是有那么点遗憾,不过生活就应该要这样,有波折有起伏,这正是我需要并且期待的...那么新的生活还是要继续,做自己的舵手,把握好自己的方向,过去的就让它过去吧。

b.对没有经验的朋友来说node其实并不好上手,从最简单“Hello world”就可以看出来(各种运行环境和安装细节的了解都得费点功夫),不要以jQuery库为比较,所处理的事物不同,学习的成本也不同 - 所以不太建议作为新手入门的服务端技术,如果想学习一门服务端语言PHP和Python都是不错的选择,因为:书多 例子多 框架多 上手简单 容易理解 搭建方便...

   c.以上都是我个人善意的建议,由于水平有限,请大家多多指教,希望嘴下留情。

  2. 关于Node的书写规范和具体技巧本人就不献丑了,自己写Node的代码也不多,不过面向对象的编程思想在哪都是好使的。

  3. 希望这篇文章能对大家学习Node有用

(0)

相关推荐

  • Node.js+Express配置入门教程详解

    Node.js是一个Javascript运行环境(runtime).实际上它是对Google V8引擎进行了封装.V8引 擎执行Javascript的速度非常快,性能非常好.Node.js对一些特殊用例进行了优化,提供了替代的API,使得V8在非浏览器环境下运行得更好.Node.js是一个基于Chrome JavaScript运行时建立的平台, 用于方便地搭建响应速度快.易于扩展的网络应用.Node.js 使用事件驱动, 非阻塞I/O 模型而得以轻量和高效,非常适合在分布式设备上运行的数据密集型

  • 零基础搭建Node.js、Express、Ejs、Mongodb服务器及应用开发入门

    本文改自非鱼的<[翻译]前端开发人员入门指南,从零开始搭建Node.js, Express, Jade, Mongodb服务器>,之所以把Jade换成Ejs,是因为我觉得ejs更符合WEB编程人员的习惯,更确切说应该是更符合PHP.ASP程序员的使用习惯.好了,废话不多说,直接开始教程. 第1部分 – 15分钟安装 如果你真的是从零开始学,那就花点时间先把环境搭建起来吧.这不难,我用的是Win8,所以这看上去跟那些用Mac和Ubuntu或者其它*nix系统的教程有点区别,不过大致是一样的. 第

  • Node.js的Web模板引擎ejs的入门使用教程

    Node 开源模板的选择很多,但推荐像我这样的老人去用 EJS,有 Classic ASP/PHP/JSP 的经验用起 EJS 来的确可以很自然,也就是说,你能够在 <%...%> 块中安排 JavaScript 代码,利用最传统的方式 <%=输出变量%>(另外 <%-输出变量是不会对 & 等符号进行转义的).安装 EJS 命令如下: npm install ejs JS 调用 JS 调用的方法主要有两个: ejs.compile(str, options); //

  • Node.js入门教程:在windows和Linux上安装配置Node.js图文教程

    本章节我们将向大家介绍在window和Linux上安装Node.js的方法. 本安装教程以Node.js v0.10.26 版本为例. Node.js安装包及源码下载地址为:http://www.nodejs.org/download/. 根据不同平台系统选择你需要的Node.js安装包. 注意:Linux上安装Node.js需要安装Python 2.6 或 2.7 ,不建议安装Python 3.0以上版本. Windowv 上安装Node.js Windows 安装包(.msi) : 32 位

  • Java开发者结合Node.js编程入门教程

    首先, 我必须得承认,作为一个有着十多年开发经验的java开发者,我已经形成了解决绝大部分问题的固有套路,尽管它们很多时候显得笨重和繁琐. 比如说如果要读取一个文件,那应该就是初始化一个BufferedReader 实例并传入一个FileReader,这几乎是顺理成章的,我在很多自认为算得上"企业级"的项目中编写这样的代码并且很享受这个过程,可以说我就是一个对其他语言不屑一顾的java脑残粉. 如果你正在阅读这篇博文,你可能已经陷入了我多年前早就陷入的一个误区,作为一名合格的开发人员应

  • Node.js简单入门前传

    1.什么是NodeJS 简单的说 Node.js 就是运行在服务端的 JavaScript. Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台. Node.js是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎(Google的Chrome浏览器使用的JavaScript执行环境), V8引擎执行Javascript的速度非常快,性能非常好. 2.为什么选择NodeJS 如果你是一个前端程序员,你不懂得像PHP.Python或Ruby等

  • Node.js包管理器Yarn的入门介绍与安装

    前言 这两天大家有没有都被Yarn悄悄刷了屏,最近Facebook 发布了新的 node.js 包管理器 Yarn 用以替代 npm .为了跟上 Javascript 这股潮 流的脚步,大概的浅尝了一下这个自称是又快又可信赖又安全的包管理,所以写的内容不会很详细,更多的可能只是针对这个全新的包管理与 npm 的不同之处来对比.也可能有些地方写得不对,如果有的话,欢迎指正. 一.安装 首先当然是安装啦.跟 npm 这种被钦点而随 nodejs 一起被安装的包管理器不同, Yarn 需要自行手动安装

  • node.js入门教程迷你书、node.js入门web应用开发完全示例

    本书状态 你正在阅读的已经是本书的最终版.因此,只有当进行错误更正以及针对新版本Node.js的改动进行对应的修正时,才会进行更新. 本书中的代码案例都在Node.js 0.6.11版本中测试过,可以正确工作. 读者对象 本书最适合与我有相似技术背景的读者: 至少对一门诸如Ruby.Python.PHP或者Java这样面向对象的语言有一定的经验:对JavaScript处于初学阶段,并且完全是一个Node.js的新手. 这里指的适合对其他编程语言有一定经验的开发者,意思是说,本书不会对诸如数据类型

  • node.js入门教程

    Node是个啥? 写个东西还是尽量面面俱到吧,所以有关基本概念的东西我也从网上选择性的拿了些下来,有些地方针对自己的理解有所改动,对这些概念性的东西有过了解的可选择跳过这段. 1.Node 是一个服务器端 JavaScript 解释器,可是真的以为JavaScript不错的同学学习Node就能轻松拿下,那么你就错了,总结:水深不深我还不知道,不过确实不浅. 2.Node 的目标是帮助程序员构建高度可伸缩的应用程序,编写能够处理数万条同时连接到一个物理机的连接代码.处理高并发和异步I/O是Node

  • Node.js开发教程之基于OnceIO框架实现文件上传和验证功能

    OnceIO 是 OnceDoc 企业内容(网盘)的底层Web框架,它可以实现模板文件.静态文件的全缓存,运行起来完全不需要I/O操作,并且支持客户端缓存优化,GZIP压缩等(只在第一次压缩),拥有非常好的性能,为您节约服务器成本.它的模块化功能,可以让你的Web进行分布式存储,即一个扩展包里即包含前端.后端和数据库定义,只需通过添加/删除目录的方式就可实现功能删减,实现真正的模块化扩展.这里是介绍如何使用OnceIO的一系列文章. 在这一章节中,我们将为大家演示如何使用 OnceIO 实现文件

  • Node.js 基础教程之全局对象

    Node.js 基础教程之全局对象 在浏览器 JavaScript 中,通常 window 是全局对象. Node.js 中的全局对象是 global,所有全局变量(除了 global 本身以外)都是 global 对象的属性. global 最根本的作用是作为全局变量的宿主. 注意: 永远使用 var 定义变量以避免引入全局变量,因为全局变量会污染 命名空间,提高代码的耦合风险. __filename 脚本绝对路径 表示当前正在执行的脚本的文件名.它将输出文件所在位置的绝对路径,且和命令行参数

  • node.js入门实例helloworld详解

    本文实例讲述了node.js入门实例helloworld.分享给大家供大家参考,具体如下: 将下面的代码保存为:server.js存到E盘下面的node目录中. var http = require('http'); function myNode(request, response){ response.writeHead(200, {'Content-type':'text/plain'}); response.write('hello world'); //hello world resp

  • p5.js入门教程之小球动画示例代码

    一.运动的小球 本节将用p5.js做一个在屏幕上运动的小球. 思路是用变量记录小球的位置,然后在draw()函数里对其做出改变,由于draw()函数会不断地运行(频率为FPS,默认60帧/秒),所以小球便产生了运动. 代码如下: var x=0; function setup() { createCanvas(400, 400); } function draw() { background(220); //width和height是关键词,分别是Canvas的宽和高 x+=2; ellipse

  • p5.js入门教程和基本形状绘制

    一.什么是p5.js 最近接触了一门数字媒体艺术类的课程,名为Interactivity,教的是p5.js. 主讲老师就是开发者之一--还是挺激动的. p5.js是一个为艺术家.设计师而开发的Javascript库,可以看作是Processing的Web版本.如果有Processing学习经验的话,p5.js上手会非常快. 至于p5.js有什么用,这个问题很难回答,因为我本身也是个初学者. 我目前觉得p5.js是一个很好的激发创意的工具,并且你可以将p5.js的内容嵌入网页,让你的网站更炫. 二

  • p5.js入门教程之键盘交互

    一.键盘交互相关关键词与函数 keyIsPressed: 关键词,按下按键时为true,反之为false keyCode: 关键词,用于判断按下哪个按键 keyPressed():函数,按键按下时触发一次 keyReleased():函数,按键松开时触发一次 keyIsDown():函数,按下指定按键时返回true,反之为false 以下是一个较综合的案例,用wsad与zxcv控制小球移动: var x=200; var y=200; var speed=2; function setup()

  • p5.js入门教程之平滑过渡(Easing)

    一.跟随鼠标移动的小球 使用mouseX,mouseY可以创建一个跟随鼠标移动的小球. function setup() { createCanvas(400, 400); } function draw() { background(220); ellipse(mouseX,mouseY,20,20); } 二.让小球更加平滑的移动--使用Easing 一般制作精良的UI界面都会用到平滑移动这一效果,也就是利用了名为"Easing"的方法. 实现思路是另外设置变量以进行位置的过渡,代

随机推荐