首页 前端开发 Web前端入门第 52 问:JavaScript 的应用领域

Web前端入门第 52 问:JavaScript 的应用领域

截至目前,您应该对前端的 HTML + CSS 应该有了很清楚的认知,至少实现一个静态网页已经完全不在话下了。

当然,CSS 功能绝不止这些,一些不太常用的 CSS 相关知识,后续将通过案例进行分享。

那么咱们接下来看看 JavaScript 的相关知识,作为前端领域三剑客之一,JavaScript 也是前端最核心的技术。

JavaScript 简称 JS,虽然它有 Java 关键字,但您必须要知道它其实与大名鼎鼎的 Java 没任何关系,据说这可能想趁 Java 热度所以才有了 JavaScript 这个名字。

JavaScript 的应用领域
在学习 JS 之前,您必须要先知道 JS 它可以用来做什么,毕竟学习一门技术,必须要有一个目标对不。

Web 前端开发
JS 的诞生就是为了弥补 Web 开发的局限性,所以最初的目的就是用来做 Web 前端开发。

核心能力:操作 DOM、处理交互、动态渲染页面。这里就不得不说 jQuery 了,它可以算是这个领域的代表之一。

现代开发框架代表:React、Vue、Angular。用于构建大型 Web 应用的技术手段之一,完全实现了前后端分离。当然这些框架也都是站在了 nodejs 的肩上,没有 nodejs 它们的影响力至少减半。

Web 后端开发
Node.js:用于构建服务端的技术之一。谷歌开源的 V8 引擎赋予了 JavaScript 灵魂,让曾经只能跑在浏览器端的 JS 可以轻松运行在服务端,让 JS 在服务端领域可以与其他服务端编程语言一争高低,代表框架 Express、Koa、NestJS等。

全栈开发
结合前端 React、Vue 和 Node.js,可以轻松做到全栈开发,让曾经只能在浏览器那角落玩耍的前端开发者们,轻轻松松的实现了领域跨越。

移动应用开发
JS 也能做移动端的 APP 开发,可以用 JS 开发 iOS/Android 原生应用,代表框架:React Native、uni-app。

桌面应用开发
基于 V8 引擎,让 JS 可以轻松实现桌面应用开发,代表框架:Electron。

游戏开发
2D/3D 游戏开发,代表框架:Phaser.js(2D)、Three.js/Babylon.js(3D)、Unity 支持通过 WebGL 导出 JS 项目。

也可使用 WebXR 开发 AR/VR 游戏。

物联网(IoT)与硬件
通过 Node.js 控制树莓派(Raspberry Pi)、Arduino 等硬件,也可使用 Johnny-Five 库进行机器人编程。

数据可视化
代表框架:D3.js、ECharts、Chart.js、Three.js。

机器学习与 AI
浏览器中训练/部署模型(如图像识别),代表框架:TensorFlow.js。

自然语言处理,代表框架:Brain.js、Natural。

构建工具
用于构建 Web 应用,比如 React、Vue、Angular 等应用打包,代表工具:Webpack、Vite、Rollup。

测试框架
用于编写端到端测试、单元测试。代表框架:Jest、Cypress。

WebAssembly
JS 与 WebAssembly(WASM)结合,实现高性能计算。比如通过 Emscripten 将 C/C++ 编译成 WASM,再通过 JS 调用。

写在最后
JavaScript 的生态版图可以说非常丰满,选择一个您感兴趣的方向专研下去必有一番成就。

当然在走向兴趣的道路之前,咱们还需要先了解 JS 的基础语法,没有基础,任何高楼幻想都是泡影~~

站星网

截至目前,您应该对前端的 HTML + CSS 应该有了很清楚的认知,至少实现一个静态网页已经完全不在话下了。当..

为您推荐

Web前端入门第 76 问:JavaScript 鼠标事件(mouse) enter/leave 和 over/out 区别

题外话在考察事件基础的时候,会经常被问及 click、mousedown、mouseup 它们三者执行的先后顺序是怎样的?如果平时没太注意,这细节可能就会忽略,毕竟很少会在同一个元素上面同时绑定这三个事件~~直接上示例:<div ..

Web前端入门第 67 问:JavaScript 中的面向对象编程

此 对象 非彼对象啊,不要理解错了哦~~面向对象编程 这个概念在 Java 编程语言中用得比较多,JS 同时支持 面向对象编程 和 函数式编程。像大名鼎鼎的 React 和 Vue 他们都有两种开发风格,比如:Vue 中的 组合式API ..

Web前端入门第 57 问:JavaScript 数据类型与类型转换

在程序语言中,数据类型是基础,一切程序都是建立在基础数据之上。如果说程序如同万丈高楼平地起,那么数据类型就像沙、石、钢筋、水泥等等最基础的原料。一样的高楼,不同的人,用相同的原料,造的方法也会有千般变..

JavaScript实现图片上传预览及获取图片尺寸和大小的完整指南

在现代Web开发中,提供图片上传的预览功能以及获取图片的尺寸和大小信息,已成为提升用户体验的重要手段。本文将详细介绍如何使用JavaScript实现这些功能,帮助你在用户上传图片前进行有效的验证和优化。一、实现图..

Web前端入门第 60 问:JavaScript 各种数组定义与数组取值方法

数组可以算是程序里面最常用的数据结构了,但凡网页上任何一个列表数据,基本都是以数组的形式存在,像表格、banner图、菜单列表、商品列表,分类列表等等,在前端领域都是以数组处理。数组的定义JS 的数组花样很多..

Web前端入门第 55 问:JavaScript 严格模式与非严格模式区别

JavaScript 默认是非严格模式的,可以通过 "use strict"; 启用严格模式。此声明语句可以放在 JS 文件顶部,也可以放在函数内部。启用严格模式1、外部脚本在 JS 文件开头声明,内部脚本在 <script> 标签开头声明,声..

Web前端入门第 53 问:JavaScript 的各种调试方法

任何一门编程语言,在学习之前都应该先弄清楚它的调试方法,毕竟没有不挖坑的人类!程序一旦出现问题,第一时间就是找到问题出在哪儿,其次才是拿出解决办法。如果都找不到问题原因,那又何从谈起解决办法呢?如何排..

Web前端入门第 54 问:JavaScript 3 种书写位置及 script 标签的正确存放位置

JS 的代码并没有强制规定放在 HTML 中的某个位置,如果您有使用过开发者工具查看过网页源码,那么您会看到很多 JS 代码都以 .js 文件的形式存放,并且放在了 HTML 文件最后,也就是 </body> 结束标签之前。但如果仔..

.NET C# 过滤从富文本编辑器html里的Javascript脚本

富文本编辑器在允许用户输入丰富内容的同时,也带来了跨站脚本攻击(XSS)的风险。过滤提交的 HTML 中的 <script> 脚本是防止跨站脚本攻击(XSS)的关键步骤。在 .NET C# 服务端过滤 <script> 脚本主要有以下几种方..

轻松学习 JavaScript函数中的默认参数

JavaScript函数可以有默认参数值。通过默认函数参数,你可以初始化带有默认值的正式参数。如果不初始化具有某些值的参数,则该参数的默认值为undefined。请看下列代码:function foo(num1){console.log(num1);}foo()..

JavaScript API 设计原则详解

前言本篇博文来自一次公司内部的前端分享,从多个方面讨论了在设计接口时遵循的原则,总共包含了七个大块。系卤煮自己总结的一些经验和教训。本篇博文同时也参考了其他一些文章,相关地址会在后面贴出来。很难做到详..

JavaScript 中精度问题以及解决方案

JavaScript 中的数字按照 IEEE 754 的标准,使用 64 位双精度浮点型来表示。其中符号位 S,指数位 E,尾数位M分别占了 1,11,52 位,并且在ES5 规范中指出了指数位E的取值范围是[-1074, 971]。精度问题汇总想用有限..

JavaScript 六种继承方式

继承是面向对象编程中又一非常重要的概念,JavaScript支持实现继承,不支持接口继承,实现继承主要依靠原型链来实现的。原型链首先得要明白什么是原型链,在一篇文章看懂proto和prototype的关系及区别中讲得非常详细..

JavaScript 事件委托详解

基本概念事件委托,通俗地来讲,就是把一个元素响应事件(click、focus……)的函数委托到另一个元素;一般来讲,会把一个或者一组元素的事件委托到它的父层或者更外层元素上,真正绑定事件的是外层元素,当事件响应..

JavaScript 中的遍历详解

编程这么多年,要是每次写遍历代码时都用 for 循环,真心感觉对不起 JavaScript 语言~对象遍历为了便于对象遍历的测试,我在下面定义了一个测试对象obj。测试对象// 为 Object 设置三个自定义属性(可枚举)Object.p..

web前端开发2018年12月找工作总结

2018年的冬天额外的冷,由内致外...作为一名刚刚踏入社会的实习生,可谓是狠狠的体验了一把什么叫社会(同时也感叹父母赚钱真的很不容易)前几天看见这样一句话"如果你不知道社会的辛苦,要么是有人替你扛了,要么是还没轮..

值得探索的 8 个机器学习 JavaScript 框架

JavaScript开发人员倾向于寻找可用于机器学习模型训练的JavaScript框架。下面是一些机器学习算法,基于这些算法可以使用本文中列出的不同JavaScript框架来模型训练:简单的线性回归多变量线性回归逻辑回归朴素贝叶斯..

JavaScript 保留两位小数

以下我们将为大家介绍 JavaScript 保留两位小数的实现方法:四舍五入以下处理结果会四舍五入:var num =2.446242342;num = num.toFixed(2); // 输出结果为 2.45不四舍五入以下处理结果不会四舍五入:第一种,先把小数边..

JavaScript 页面跳转、页面重定向

JavaScript 实现页面跳转重定向可以使用以下两种方法:window.location.replace("url")类似 HTTP 重定向将地址替换成新 url,该方法通过指定 URL 替换当前缓存在历史里(客户端)的项目,因此当使用 replace 方法之..

在 Javascript 中 声明时用 var 与不用 var 的区别

avascript 声明变量的时候,虽然用 var 关键字声明和不用关键字声明,很多时候运行并没有问题,但是这两种方式还是有区别的。可以正常运行的代码并不代表是合适的代码。var num = 1;是在当前域中声明变量。如果在方..

发表回复

返回顶部

微信分享

微信分享二维码

扫描二维码分享到微信或朋友圈

链接已复制