deor教程，denoise教程

作者： semlinker传输链接： https://MP.weixin.QQ.com/s/2 eqrtsf _ z7bcs6dzi xe 73 q

另一方面，Deno配置文件Deno在JavaScript/TypeScript运行时，缺省情况下使用安全环境运行代码，具有很好的开发体验。 Deno包含默认安全功能的亮点。 除非明确打开外部代码，否则外部代码无权访问文件系统、网络或环境。 支持开箱即用TypeScript的环境。 只分发一个独立的可执行文件( deno )。 它内置了依存关系信息查看器( deno info )和代码格式工具( deno fmt )等工具箱。 有一组经过审核的标准模块，可以确保在Deno上运行。 脚本代码可以打包在单独的JavaScript文件中。 Deno是一个跨平台运行时环境，基于Google V8引擎。 这个运行时环境用Rust语言开发，并使用Tokio库构建事件循环系统。 Deno基于V8、Rust和Tokio构建，体系结构如下：

(图片来源： https://deno.land/manual/contributing/architecture )

1.1 RustRust是由Mozilla主导开发的通用编译型编程语言。 设计原则是“安全、同时、实用”，支持函数式、同时、过程式以及面向对象的编程风格。 Deno可以使用Rust语言封装V8引擎并使用libdeno绑定，以调用由JavaScript隔离的功能。

1.2 TokioTokio是Rust编程语言的异步运行时，提供异步事件驱动平台，构建高速、可靠、轻量级的网络APP。 利用Rust的所有权和并发模型确保线程安全。 Tokio构建在Rust之上，提供了极高的性能，非常适合高性能服务器APP应用。 在Deno中，TokIO用于并行执行所有异步io任务。

1.3 V8V8是谷歌开发的开源JavaScript引擎，在谷歌chrome和Chromium中使用。 在执行V8之前将JavaScript编译成机器代码而不是字节代码或解释器来运行，从而提高性能。 此外，使用在线缓存等方法提高了性能。 这些功能使JavaScript程序能够实现与V8引擎速度相媲美的二进制编译。 在Deno中，V8引擎用于执行JavaScript代码。

二、安装DenoDeno后可以在macOS、Linux、Windows上运行。 Deno是另一个可执行文件，没有其他依赖关系。 可以通过以下方法安装。

外壳(使用MACOS和Linux ) ( curl-fssl 3359 deno.land/x/install/install.sh | sh为PowerShell ) windows )使用iwr 3359 deno.sh iex为scoop(windows ):scoopinstalldeno为chocolatey ) windows:chocoinstalllldeno 您只需从github.com/den oland/deno/releases下载zip文件。 只包含一个可执行文件。 在macOS和Linux上，必须设置执行权限。 安装成功后，可以运行Deno --version命令以确定已安装的deno的版本。

$ Deno-- version deno1.0.0v 88.4.300 typescript3.9. 22.1 deno-CLI deno-CLI命令行界面集成，可让您沉浸在deno的专有开发环境中deno1.0. 0版支持的所有子命令如下所示。

sub commands:bundlebundlemoduleandependenciesintosinglefilecachethedependenciescompletionsgenerateshellcompletionsdocshocsh achocsh fileshelpprintsthismessageorthelpofthegivensubcommand ( s ) )。 infoshowinfoaboutcacheorinforelatedtosourceinstallinstallscriptasanexecutablereplreadevalprintloprunaprogramgivenafilenafiled 当metypescriptdeclarationsupgradeupgradedenoexecutabletogivenversion 2.2 repl在命令中键入deno命令时，将启动repl(read-)

$ deno deno1.0.0exitusingctrldorclose ( )1 23constname='semlinker '； undefinedconsole.log(name； semlinkerundefined三、Deno首次体验3.1欢迎demo相信一些读者已经等不及安装完Deno了。 现在就体验一下deno APP应用吧。 首先打开熟悉的命令行，然后在命令行中输入以下命令：

$ de norun https://deno.land/STD/examples/welcome.ts download https://deno.land/STD/examples/welcome.tswarningimplice welcome.ts compile 3359 deno.land/STD/examples/welcome.tswelcometodeno通过观察以上输出，在运行denorun3359deno.land时此文件的内容如下：

console.log(welcometodeno )； 文件下载成功后，Deno将编译welcome.ts文件。 这意味着编译到welcome.ts.js文件中，然后运行V8引擎编译的JavaScript文件。 请注意，在命令行中重新运行以上命令将执行缓存中生成的文件，并且不会再次联机下载welcome.ts文件。

$ de norun https://deno.land/STD/examples/welcome.tswelcometodeno再次运行上述命令时，deno将编译到缓存中并生成的JavaScript文件本节介绍显示有关缓存或源文件的信息的deno info命令。

$ denoinfodeno _ dirlocation:'/users/fer/library/caches/deno ' remotemodulescache:'/users/fer/library/c 这显然是TypeScript编译器缓存的目录，进入这个目录后，通过分层搜索，最终在examples目录下找到了Welles

打开exampleslswelcome.ts.js welcome.ts.js.map welcome.ts.meta目录中的welcome.ts.js文件，可以看到以下内容：

' usestrict '； console.log(welcometodeno )； //sourcemappingurl=file://users/fer/library/caches/deno/gen/https/deno.land/STD/examples/weles

' usestrict '； console.log(hellosemlinker，fromCache )； console.log(welcometodeno )； //sourcemappingurl=file://users/fer/library/caches/deno/gen/https/deno.land/STD/examples/weles

$ de norun https://deno.land/STD/examples/welcome.tshellosemlinker， 在fromCacheWelcometoDeno中，如何强制刷新高速缓存(即重新编译TypeScript代码)是一个问题。针对此问题，当您运行Deno run命令时，--relelect

$ de norun-- reload https://deno.land/STD/examples/welcome.ts download 3359 deno.land/STD/examples/welcome.tswaaa 除了--reload标志外，Deno run命令还支持STD/examples/welcome.tswelcometodeno

介绍了如何运行3.2 TCP echo server公式的欢迎示例。 本节介绍如何使用Deno创建简单的TCP echo服务器。 首先，创建一个learn-deno项目，在项目下创建一个新的quickstart目录，然后创建一个新的echo_server.ts文件，并键入以下代码：

const listener=deno.listen ( { port:8080 } )； console.log ( listening on 0.0.0.0:8080 )； forawait(constconnoflistener ) deno.copy ( conn，conn )； }for await.of语句是String、Array、Array-like对象(例如arguments或NodeList )、TypedArray、Map、Set、自定义异步或可同步重复对象

for await.of的语法如下：

for await { variableofiterable } { statement }

输入上述代码后，我相信很多读者会和我一样直接在命令行上执行以下命令。

quickstartdenorun./echo _ server.tscompilefile://users/fer/learn projects/learn-deno/quick start/echo _ server.ts error:uncaughtpermissiondenied:networkaccessto '0.0.0: 8080 '， runagainwiththe---allow-- netflagatunwrapresponse ( $ deno $/ops/dispatch _ JSON.ts:43:11 ) at object.sendend net.ts:51:10 ) atobject.listen ) $Deno$/net.ts:152:22 ) atfile:/echo_server.ts:1:23显然是权限错误为什么会这样呢？ 这是因为Deno在JavaScript/TypeScript运行时使用缺省安全环境执行代码。 然后添加--allow-net标志，并再次运行echo_server.ts文件。

quickstartdenorun-- allow-net./echo _ server.tslisteningon0.0.0: 8080服务器正常运行后，使用nc命令测试服务器功能。

~ NC localhost 8080 hellsemlinkerhellsemlinker介绍了如何使用Deno创建简单的TCP echo服务器，然后介绍了如何使用Deno创建简单的HTTP服务器。

3.3与http server TCP server类似，在quickstart目录下创建新的http_server.ts文件，然后键入：

import { serve } from ' https://deno.land/STD @ v0. 50.0/http/server.ts '； 连续端口=8080； consts=serve({port:port} )； console.log ( listening on:$ { port }/`； forawait(constreqofs ) req.respond ) body:'hellosemlinker\n ' )； }友情提示：在实际开发过程中，可以通过https://deno.land/std地址获取所需的标准库版本。 在示例中明确指定了版本，但当然也可以不指定版本。 例如，https://deno.land/STD/http/server.ts。

上面的代码将serve函数导入到Deno标准库的http模块中，并使用该函数快速创建了http服务器。 该函数的定义如下。

//STD/http/server.tsexportfunctionserve ( addr:string|http options ):server ) if ) typeofaddr==='string ' ) addr={hostname，port:number(port )； }constlistener=listen(addr )； 返回新服务器(监听器； }serve函数接受string | HTTPOptions类型的参数。 其中，http选项接口定义如下：

/* * optionsforcreatinganhttpserver.*/exporttypehttpoptions=omit； exportinterfacelistenoptions {/* * theporttolistenon.*/port:number；/* * aliteralipaddressorhostnamethatcanberesolvedtoanipaddress.* if not specified、 defaultsto`0.0.0.0`.*/hostnaied }如果输入的参数类型是字符串，则serve函数使用冒号截断字符串，获取hostname和port，然后包装在对象中，以进行addr 继续使用addr参数调用listen函数创建监听器对象，最终调用newserver(listener )创建HTTP服务器。

创建HTTP服务器后，启动服务器，打开命令行，然后输入以下命令：

quickstartdenorun---- allow-net./http _ server.tscompilefile://users/fer/learn projects/learn-deno/que

Hello World\n四、调试DenoDeno支持V8解释协议。 您可以使用Chrome Devtools或支持VSCode等协议的其他客户端来调试Deno程序。 要启用调试功能，请在--inspect或----inspect--brk选项中执行Deno。 相应的选项如下所示。

- inspect=activateinspectoronhost:port ( default:127.0.0.1:9229 )-inspect-brk=activateinspectoronhost

4.1在Chrome dev tools中，让我们使用chrome开发人员工具调试简单的程序。 使用来自std的file_server.ts。 这是一个简单的静态文件服务。

使用--inspect-brk选项在第一行代码中暂停执行。

$ de norun-- inspect-brk-- allow-read-- allow-net https://deno.land/STD @ v 0.50.0/http/file _ server.tsdd

有关详细调试过程，请参见https://deno.land/manual/tools/debugger URL地址。

4.2 VSCodeDeno可以用VSCode调试。 的官方支持是正在开发中的https://github.com/den oland/vs code _ deno/issues/12。 当然，也可以通过手动提供launch.json配置来连接调试器。

{'version':'0.2.0'，' configurations':[{'name':'Deno '，' type':'node '，' request ':' launch '

尝试调试本地源文件并创建server.ts。

import { serve } from ' https://deno.land/STD @ v0. 50.0/http/server.ts '； consts=serve({port:8000} )； console.log ( http://localhost:8000/' )； forawait(constreqofs ) req.respond ) body:'Helloworld\n'}； 更改为server.ts并运行。

(图片来源： https://deno.land/manual/tools/debugger )

(图片来源： https://deno.land/manual/tools/debugger )

读了这篇文章之后，不知道伙伴们是否对Deno感兴趣？ 如果有的话，欢迎合作伙伴的消息。 之后，我将再介绍一篇使用Deno开发Web API的文章。

推荐Vue学习资料文章： 《Deno 正式发布，彻底弄明白和 node 的区别》

《「实践」基于Apify+node+react/vue搭建一个有点意思的爬虫平台》

《「实践」深入对比 Vue 3.0 Composition API 和 React Hooks》

《前端网红框架的插件机制全梳理（axios、koa、redux、vuex）》

《深入Vue 必学高阶组件 HOC「进阶篇」》

《深入学习Vue的data、computed、watch来实现最精简响应式系统》

《10个实例小练习，快速入门熟练 Vue3 核心新特性（一）》

《10个实例小练习，快速入门熟练 Vue3 核心新特性（二）》

《教你部署搭建一个Vue-cli4+Webpack移动端框架「实践」》

《2020前端就业Vue框架篇「实践」》

《详解Vue3中 router 带来了哪些变化？》

《Vue项目部署及性能优化指导篇「实践」》

《Vue高性能渲染大数据Tree组件「实践」》

《尤大大细品VuePress搭建技术网站与个人博客「实践」》

《10个Vue开发技巧「实践」》

《是什么导致尤大大选择放弃Webpack？【vite 原理解析】》

《带你了解 vue-next（Vue 3.0）之 小试牛刀【实践】》

《带你了解 vue-next（Vue 3.0）之 初入茅庐【实践】》

《实践Vue 3.0做JSX(TSX)风格的组件开发》

《一篇文章教你并列比较React.js和Vue.js的语法【实践】》

《手拉手带你开启Vue3世界的鬼斧神工【实践】》

《深入浅出通过vue-cli3构建一个SSR应用程序【实践】》

《怎样为你的 Vue.js 单页应用提速》

《聊聊昨晚尤雨溪现场针对Vue3.0 Beta版本新特性知识点汇总》

《【新消息】Vue 3.0 Beta 版本发布，你还学的动么？》

《Vue真是太好了 壹万多字的Vue知识点 超详细!》

《Vue + Koa从零打造一个H5页面可视化编辑器——Quark-h5》

《深入浅出Vue3 跟着尤雨溪学 TypeScript 之 Ref 【实践】》

《手把手教你深入浅出vue-cli3升级vue-cli4的方法》

《Vue 3.0 Beta 和React 开发者分别杠上了》

《手把手教你用vue drag chart 实现一个可以拖动 / 缩放的图表组件》

《Vue3 尝鲜》

《总结Vue组件的通信》

《手把手让你成为更好的Vue.js开发人员的12个技巧和窍门【实践】》

《Vue 开源项目 TOP45》

《2020 年，Vue 受欢迎程度是否会超过 React？》

《尤雨溪：Vue 3.0的设计原则》

《使用vue实现HTML页面生成图片》

《实现全栈收银系统（Node+Vue）（上）》

《实现全栈收银系统（Node+Vue）（下）》

《vue引入原生高德地图》

《Vue合理配置WebSocket并实现群聊》

《多年vue项目实战经验汇总》

《vue之将echart封装为组件》

《基于 Vue 的两层吸顶踩坑总结》

《Vue插件总结【前端开发必备】》

《Vue 开发必须知道的 36 个技巧【近1W字】》

《构建大型 Vue.js 项目的10条建议》

《深入理解vue中的slot与slot-scope》

《手把手教你Vue解析pdf(base64)转图片【实践】》

《使用vue+node搭建前端异常监控系统》

《推荐 8 个漂亮的 vue.js 进度条组件》

《基于Vue实现拖拽升级（九宫格拖拽）》

《手摸手，带你用vue撸后台 系列二(登录权限篇)》

《手摸手，带你用vue撸后台 系列三(实战篇)》

《前端框架用vue还是react？清晰对比两者差异》

《Vue组件间通信几种方式，你用哪种？【实践】》

《浅析 React / Vue 跨端渲染原理与实现》

《10个Vue开发技巧助力成为更好的工程师》

《手把手教你Vue之父子组件间通信实践讲解【props、$ref 、$emit】》

《1W字长文+多图，带你了解vue的双向数据绑定源码实现》

《深入浅出Vue3 的响应式和以前的区别到底在哪里？【实践】》

《干货满满!如何优雅简洁地实现时钟翻牌器(支持JS/Vue/React)》

《基于Vue/VueRouter/Vuex/Axios登录路由和接口级拦截原理与实现》

《手把手教你D3.js 实现数据可视化极速上手到Vue应用》

《吃透 Vue 项目开发实践16个方面深入前端工程化开发技巧【上】》

《吃透 Vue 项目开发实践16个方面深入前端工程化开发技巧【中】》

《吃透 Vue 项目开发实践16个方面深入前端工程化开发技巧【下】》

《Vue3.0权限管理实现流程【实践】》

《后台管理系统，前端Vue根据角色动态设置菜单栏和路由》作者： semlinker传输链接： https://MP.weixin.QQ.com/s/2 eqrtsf _ z7bcs6dzi xe 73 q

• 上一篇：googlemap教学，googlemap详解
• 下一篇：3月12-18日Xbox金会员+Deep Silver+EA游戏促销 含《辐射76》《战地5》《NBA 2K19》