截至目前,您应该对前端的 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 的基础语法,没有基础,任何高楼幻想都是泡影~~

Web前端入门第 52 问:JavaScript 的应用领域的更多相关文章

  1. web前端入坑第五篇:秒懂Vuejs、Angular、React原理和前端发展历史

    秒懂Vuejs.Angular.React原理和前端发展历史 2017-04-07 小北哥哥 前端你别闹 今天来说说 "前端发展历史和框架" 「前端程序发展的历史」 「 不学自知, ...

  2. Android零基础入门第52节:自定义酷炫进度条

    原文:Android零基础入门第52节:自定义酷炫进度条 Android系统默认的ProgressBar往往都不能满足实际开发需要,一般都会开发者自定义ProgressBar. 在Android开发中 ...

  3. web前端入坑第二篇:web前端到底怎么学?干货资料! 【转】

    http://blog.csdn.net/xllily_11/article/details/52145172 版权声明:本文为博主[小北]原创文章,如要转载请评论回复.个人前端公众号:前端你别闹,J ...

  4. web前端(13)—— 了解JavaScript,JavaScript的引入方式

    从本篇博文开始,将进入web前端方便最关键最重要的部分——javascript,学到后面你就知道它真的太重要了 什么是JavaScript JavaScript一种直译式的脚本语言,是一种动态类型.弱 ...

  5. WEB前端工程师整理的原生JavaScript经典百例

    一.原生JavaScript实现字符串长度截取 二.原生JavaScript获取域名主机 三.原生JavaScript转义html标签 四.原生JavaScript时间日期格式替换 Date.prot ...

  6. Web前端基础怎么学? JavaScript、html、css知识架构图

    以前开发者只要掌握 HTML.CSS.JavaScript 三驾马车就能胜任一份前端的工作了.而现在除了普通的编码以外,还要考虑如何性能优化,如何跨端.跨平台实现功能,尤其是 AI.5G 技术的来临, ...

  7. web前端学习之HTML CSS/javascript之一

    前端编码之路之坎坷,web前端应该一直是个战场吧,各种浏览器的不兼容,各种小细节的修改,要往一个好的产品经理方向走,实在是难,昨天听了一位十年经验的产品经理讲座,最重要的恐怕就是协调资源的能力,而协调 ...

  8. Web前端开发规范【HTML/JavaScript/CSS】

    前言 这是一份旨在增强团队的开发协作,提高代码质量和打造开发基石的编码风格规范,其中包含了 HTML, JavaScript 和 CSS/SCSS 这几个部分.我们知道,当一个团队开始指定并实行编码规 ...

  9. web前端——实例中学习css,javascript

    最近闲暇时候在研究前端的样式和js,以前都是从w3school上看看那些选择器和DOM操作方法很少去实际做demo来研究,做的过程当中才真切感觉到纸上得来终觉浅,看得懂跟能做出东西完全两码事,尤其在定 ...

  10. 文成小盆友python-num14 - web 前端基础 html ,css, JavaScript

    本部分主要内容 html - 基础 css - 基础 一.html 标签 html 文档标签树如下: head 部分 Meta(metadata information) 提供有关页面的元信息,例:页 ...

随机推荐

  1. [CF1981E] Turtle and Intersected Segments 题解

    好题好题. 难点在建图,因为图的边数将会决定最小生成树的时间复杂度.我们肯定希望能够只建 \(O(n)\) 级别的边,这样时间复杂度就可以做到 \(O(n\log n)\). 观察到当 \(i,j,k ...

  2. TortoiseGit 在windows11 中使用,建议升级到 2.13.0版本以后

  3. IIS反向代理和URL重写——实现https重定向,文件类型隐藏访问重写,nodejs等服务重写等等

    一.Why? 1.先来讲一讲为什么我们要使用url重写这个东西 2.因为我学习的后端是nodejs,然后我发现nodejs一个非常让人难受的事,就是它监听端口不是80和443时,你访问网页需要输入端口 ...

  4. Vue 前端页面利用MediaRecorder实现音频录制

    Don't Talk, code is here: 重点是startRecord 方法 <template> <div> <el-tooltip class=" ...

  5. JavaGUI - [03] LayoutManager布局管理器

      Component中有一个方法setBounds()可以设置当前容器的位置和大小,但如果我们手动为组件设置位置和大小的话,就会造成程序的不通用性.LayoutManager布局管理器可以根据运行平 ...

  6. JS代码执行

  7. 性能对比实验折线图绘制代码(YOLO系列为例)

    本文用于绘制性能折线图,适用于对比实验,发现很多博文都是收费,欺负哥们懒得学习,一气之下ai了一下再进行代码修改,免费供给大家学习参考,便于大家撰写论文数据时利于绘制图像. import pandas ...

  8. ppt 文字 +图 样式 设计

    1. 设计前 设计后 图 +文字排版 图多 字少

  9. cypress route 拦截 zepto ajax 请求时候 response 返回 null 问题原因

    原文链接:https://blog.jijian.link/2020-08-03/cypress-zepto-ajax-response-null/ 如果你项目有如下几个巧合,大概率会发现一个 aja ...

  10. (C++实现)2-NAF

    (C++实现)2-NAF 前言 ‍ 任何一个非负整数,都有一个唯一的 NAF (Non-adjacent form) 表示. 因着课程的缘由,我不得不研究一下 NAF 是怎么实现的,也是现学现用. ‍ ...