当前位置: 首页 > news >正文

邂逅JavaScript

前言:前端三大核心

前端开发最主要需要掌握的是三个知识点:HTML、CSS、JavaScript

在这里插入图片描述

一、认识编程语言

1.计算机语言

前面我们已经学习了HTML和CSS很多相关的知识:

  • 在之前我们提到过, HTML是一种标记语言, CSS也是一种样式语言;

他们本身都是属于计算机语言, 因为都在和计算机沟通交流;

  • 在生活中两个人想要沟通, 必然是通过某一种语言(中文/英语/粤语/东北话)
  • 计算机语言就是我们人和计算机进行交流要学习的语言;

网页的三大组成部分的另外一个核心就是JavaScript:JavaScript必然也是一种计算机语言;

在这里插入图片描述

2.编程语言

事实上, JavaScript 我们可以对其有更加精准的说法:一种编程语言.

我们先搞清楚计算机语言和编程语言的关系和区别:

  • 计算机语言:计算机语言(computer language)指用于人与计算机之间通讯的语言,是人与计算机之间传递信息的介质。但是其概念比通用的编程语言要更广泛。例如,HTML是标记语言,也是计算机语言,但并不是编程语言
  • 编程语言:编程语言(英语:programming language),是用来定义计算机程序的形式语言。它是一种被标准化的交流技巧, 用来向计算机发出指令,一种能够让程序员准确地定义计算机所需要使用数据的计算机语言,并精确地定义在不同情况下所应当采取的行动

很抽象, 我们来说明一下编程语言的特点:

  • 数据和数据结构
  • 指令及流程控制
  • 引用机制和重用机制
  • 设计哲学

这样的区分是否有意义呢?我们这里不讨论,我这里只把最专业的定义来告诉大家。

二、编程语言发展历史

1.常见的编程语言

在这里插入图片描述

2.编程语言的发展历史 – 机器语言

阶段一: 机器语言

  • 计算机的存储单元只有0和1两种状态,因此一串代码要让计算机“读懂”,这串代码只能由数字0和1组成。
  • 像这种由数字0和1按照一定的规律组成的代码就叫机器码,也叫二进制编码
  • 一定长度的机器码组成了机器指令,用这些机器指令所编写的程序就称为机器语言。

优点:

  • 代码能被计算机直接识别,不需要经过编译解析;

  • 直接对硬件产生作用,程序的执行效率非常高

缺点:

  • 程序全是些0和1的指令代码,可读性差,还容易出错;
  • 不易编写(目前没有人这样开发);

3.编程语言的发展历史 – 汇编语言

阶段二: 汇编语言

  • 为了解决机器语言的缺陷,人们发明了另外一种语言——汇编语言
  • 这种语言用符号来代替冗长的、难以记忆的0、1代码。(mov/push指令,经过汇编器,汇编代码再进一步转成0101)

优点:

  • 像机器语言一样,可以直接访问、控制计算机的各种硬件设备;

  • 占用内存少,执行速度快

缺点:

  • 第一,不同的机器有不同的汇编语言语法和编译器,代码缺乏可移植性
    • 也就是说,一个程序只能在一种机器上运行,换到其他机器上可能就不能运行;
  • 第二,符号非常多、难记
    • 即使是完成简单的功能也需要大量的汇编语言代码,很容易产生BUG,难于调试;

应用场景

  • 操作系统内核、驱动程序、单片机程序;

4.编程语言的发展历史 – 高级语言

阶段三: 高级语言

  • 最好的编程语言应该是什么? 自然语言
  • 而高级语言, 就是接近自然语言, 更符合人类的思维方式
  • 跟和人交流的方式很相似, 但是大多数编程语言都是国外发明的, 因为都是接近于英文的交流方式

优点:

  • 简单、易用、易于理解,语法和结构类似于普通英文;

  • 远离对硬件的直接操作,使得一般人经过学习之后都可以编程,而不用熟悉硬件知识

  • 一个程序还可以在不同的机器上运行,具有可移植性

缺点:

  • 程序不能直接被计算机识别,需要经编译器翻译成二进制指令后,才能运行到计算机上;
  • 种类繁多:JavaScript 、 C语言、C++、C#、Java、Objective-C 、Python等;

5.机器语言和高级语言

在这里插入图片描述

在前端,我们需要学好的只有一门高级语言:JavaScript。

三、JavaScript的历史

1.认识JavaScript

维基百科对JavaScript的定义:

  • JavaScript(通常缩写为JS)是一种高级的解释型的编程语言;
  • JavaScript是一门基于原型头等函数的语言,是一门多范式的语言,它支持面向对象程序设计,指令式编程,以及函数式编程

从上面的定义中, 我们会发现很多关键词:

  • 解释型语言? 原型? 头等函数? 多范式? 面向对象程序设计? 指令式编程? 函数式编程?
  • 这些改变往往会让人不知所云,需要我们完全掌握JavaScript再来回头看,每一个词语描述的都非常准确;

现在只需要知道,通俗的说法:

  • JavaScript是一门高级编程语言, 是前端开发的重要组成部分!

HTML和CSS也是前端开发的重要组成部分, 而JavaScript是前端开发的灵魂;

2.JavaScript的起源

1994年,网景公司(Netscape)发布了Navigator浏览器0.9版。

  • 这是历史上第一个比较成熟的网络浏览器,轰动一时。
  • 但是,这个版本的浏览器只能用来浏览,不具备与访问者互动的能力。
  • 网景公司急需一种网页脚本语言,使得浏览器可以与网页互动。

在这里插入图片描述

网景公司当时想要选择一种语言来嵌入到浏览器中:

  • 采用现有的语言,比如Perl、Python、Tcl、Scheme等等, 允许它们直接嵌入网页;
  • 1995年网景公司招募了程序员Brendan Eich,希望将Scheme语言作为网页脚本语言的可能性;

就在这时,发生了另外一件大事:1995年Sun公司将Oak语言改名为 Java,正式向市场推出;

  • Java推出之后立马在市场上引起了轰动,Java当初有一个口号:“write once run anywhere”;
  • 网景公司动了心,决定与Sun公司结成联盟,希望将Java嵌入到网页中来运行;
  • Brendan Eich 本人非常热衷于Scheme,但是管理层那个时候有点倾向于Java,希望可以简化Java来适应网页脚本的需求;

在这里插入图片描述

但是Brendan Eich对此并不感兴趣,他用10天时间设计出来了JavaScript;

  • 最初这门语言的名字是Mocha(摩卡);
  • 在Navigator2.0 beta版本更名为 LiveScript
  • 在Navigator2.0 beta 3版本正式重命名为JavaScript,当时是为了给这门语言搭上Java这个热词;

当然10天设计出来语言足够说明Brendan Eich是天才,但是这门语言当时更像是一个多种语言的大杂烩;

  • 借鉴C语言的基本语法;

  • 借鉴Java语言的数据类型和内存管理;

  • 借鉴Scheme语言,将函数提升到"第一等公民"(first class)的地位;

  • 借鉴Self语言,使用基于原型(prototype)的继承机制。

Brendan Eich曾经这样描述过 JavaScript:

  • 与其说我爱 Javascript,不如说我恨它,它是C语言和Self语言一夜情的产物;

  • 十八世纪英国文学家约翰逊博士说得好:'它的优秀之处并非原创,它的原创之处并不优秀。’

  • the part that is good is not original, and the part that is original is not good.

微软公司于1995年首次推出Internet Explorer,从而引发了与Netscape的浏览器大战。

  • 微软对Netscape Navigator解释器进行了逆向工程,创建了JScript,以与处于市场领导地位的网景产品同台竞争;
  • 这个时候对于开发者来说是一场噩耗,因为需要针对不同的浏览器进行不同的适配;

1996年11月,网景正式向ECMA(欧洲计算机制造商协会)提交语言标准。

  • 1997年6月,ECMA以JavaScript语言为基础制定了ECMAScript标准规范ECMA-262;
  • ECMA-262是一份标准,定义了ECMAScript;
  • JavaScript成为了ECMAScript最著名的实现之一;
  • 除此之外,ActionScript和JScript也都是ECMAScript规范的实现语言;

所以说,ECMAScript是一种规范,而JavaScript是这种规范的一种实现。

四、JavaScript的分类

1.JavaScript的组成

ECMAScript是JavaScript的标准,描述了该语言的语法和基本对象。

  • JavaScript是ECMAScript的语言层面的实现;
  • 因为除了语言规范之外,JavaScript还需要对页面和浏览器进行各种操作;
  • 除了基本实现之外,还包括DOM操作和BOM操作;

目前我们会针对性的学习ECMAScript,也就是语言层面的内容,特别是ES5之前的语法。

在这里插入图片描述

2.JavaScript由谁来运行?

我们经常会说:不同的浏览器有不同的内核组成

  • Gecko:早期被Netscape和Mozilla Firefox浏览器浏览器使用;
  • Trident:微软开发,被IE4~IE11浏览器使用,但是Edge浏览器已经转向Blink;
  • Webkit:苹果基于KHTML开发、开源的,用于Safari,Google Chrome之前也在使用;
  • Blink:是Webkit的一个分支,Google开发,目前应用于Google Chrome、Edge、Opera等;

事实上,我们经常说的浏览器内核指的是浏览器的排版引擎:

  • 排版引擎(layout engine),也称为浏览器引擎(browser engine)、页面渲染引擎(rendering engine)或样版引擎。

那么,JavaScript代码由谁来执行呢?

  • JavaScript引擎

五、JavaScript运行引擎

1.认识JavaScript引擎

为什么需要JavaScript引擎呢?

  • 我们前面说过,高级的编程语言都是需要转成最终的机器指令来执行的;
  • 事实上我们编写的JavaScript无论你交给浏览器或者Node执行,最后都是需要被CPU执行的;
  • 但是CPU只认识自己的指令集,实际上是机器语言,才能被CPU所执行;
  • 所以我们需要JavaScript引擎帮助我们将JavaScript代码翻译成CPU指令来执行;

比较常见的JavaScript引擎有哪些呢?

  • SpiderMonkey:第一款JavaScript引擎,由Brendan Eich开发(也就是JavaScript作者);
  • Chakra:微软开发,用于IT浏览器;
  • JavaScriptCore:WebKit中的JavaScript引擎,Apple公司开发;
  • V8:Google开发的强大JavaScript引擎,也帮助Chrome从众多浏览器中脱颖而出;

2.浏览器内核和JS引擎的关系

这里我们先以WebKit为例,WebKit事实上由两部分组成的:

  • WebCore:负责HTML解析、布局、渲染等等相关的工作;
  • JavaScriptCore:解析、执行JavaScript代码;

小程序中也是这样的划分:

  • 在小程序中编写的JavaScript代码就是被JSCore执行的;

在这里插入图片描述

在这里插入图片描述

六、JavaScript应用场景

1.著名的Atwood定律

Stack Overflow的创立者之一的 Jeff Atwood 在2007年提出了著名的 Atwood定律:

  • Any application that can be written in JavaScript, will eventually be written in JavaScript.

  • 任何可以使用JavaScript来实现的应用都最终都会使用JavaScript实现。

2.JavaScript应用越来越广泛

在这里插入图片描述

相关文章:

邂逅JavaScript

前言:前端三大核心 前端开发最主要需要掌握的是三个知识点:HTML、CSS、JavaScript 一、认识编程语言 1.计算机语言 前面我们已经学习了HTML和CSS很多相关的知识: 在之前我们提到过, HTML是一种标记语言, CSS也是一种样式语言; 他们本身都是属于计算…...

Android 中 Fragment判空

1. 判断 Fragment 是否已经被添加到 Activity 中,可以通过 Fragment 的 isAdded() 方法来判断。 2. 判断 Fragment 的 View 是否已经被创建,可以通过 Fragment 的 getView() 方法来判断。 3. 判断 Fragment 是否已经被销毁,可以通过 Fragme…...

软考高级系统架构设计师系列论文八十八:财务数据仓库系统的设计与实现

软考高级系统架构设计师系列论文八十八:财务数据仓库系统的设计与实现 一、摘要二、正文三、总结一、摘要 近年来,数据仓库技术在信息系统的建设中得到了广泛应用,有效地为决策提供了支持。2020年6月,本人所在单位组织开发了财务管理决策系统,该系统主要是使高层领导掌握企…...

fastdeploy部署多线程/进程paddle ocr(python flask框架 )

部署参考:https://github.com/PaddlePaddle/FastDeploy/blob/develop/tutorials/multi_thread/python/pipeline/README_CN.md 安装 cpu: pip install fastdeploy-python gpu :pip install fastdeploy-gpu-python #下载部署示例代码 git cl…...

【图论】拓扑排序

一.定义 拓扑排序是一种对有向无环图(DAG)进行排序的算法,使得图中的每个顶点在排序中都位于其依赖的顶点之后。它通常用于表示一些任务之间的依赖关系,例如在一个项目中,某些任务必须在其他任务之前完成。 拓扑排序的…...

自动化备份方案

背景说明 网上有很多教程,写的都是从零搭建一个什么什么,基本上都是从无到有的教程,但是,很少有文章提及搭建好之后如何备份,这次通过请教GitHub Copilot Chat,生成几个备份脚本,以备后用。 注…...

win11出现安全中心空白和IT管理员已限制对此应用的某些区域的访问

问题 windows安全中心服务被禁用 winr 输入services.msc 找到windows安全中心服务查看是否被禁用,改为启动,不可以改动看第三条 打开设置,找到应用—windows安全中心–终止–修复–重置 重启如果还是不行看第四条 家庭版系统需要打开gped…...

github实用指令(实验室打工人入门必备)

​​​​​​​​博主进入实验室啦,作为一只手残党决定在这里分享一些常用的github使用情景和操作指南来解救其他手残党。 内容随着情景增加实时更新。如果只有没几个内容说明场景不多(相信对手残党而言是再好不过的消息) 情景一&#xff1a…...

6. 激活层

6.1 非线性激活 ① inplace为原地替换,若为True,则变量的值被替换。若为False,则会创建一个新变量,将函数处理后的值赋值给新变量,原始变量的值没有修改。 import torch from torch import nn from torch.nn import …...

AIGC ChatGPT 制作地图可视化分析

地图可视化分析是一种将数据通过地图的形式进行展示的方法,可以让人们更加直观、快速、准确的理解和分析数据。以下是地图可视化分析的一些主要好处: 加强数据理解:地图可视化可以将抽象的数字转化为直观的图形,帮助我们更好地理解复杂的数据集。 揭示地理模式:地理位置是…...

2023-08-24 LeetCode每日一题(统计参与通信的服务器)

2023-08-24每日一题 一、题目编号 1267. 统计参与通信的服务器二、题目链接 点击跳转到题目位置 三、题目描述 这里有一幅服务器分布图,服务器的位置标识在 m * n 的整数矩阵网格 grid 中,1 表示单元格上有服务器,0 表示没有。 如果两台…...

前端实习day35

今天是下早班的一天,下完班直接赶车回广州了,吐槽一下深圳站管理得真得差,候车厅小,人巨多,而且进站口的标识也很少,绕了好久才找到!下次再也不去了。 今天是改bug的一天,但是有半天…...

Linux安装jupyter notebook

1. Linux安装jupyter notebook 1.1 生成配置文件 这里在conda环境中安装。 jupyter notebook --generate-config --allow-root上面命令是生成配置文件,并且允许使用root用户运行。配置文件默认生成到~/.jupyter/jupyter_notebook_config.py。 具体解释如下&…...

【猿灰灰赠书活动 - 03期】- 【RHCSA/RHCE 红帽Linux认证学习指南(第7版) EX200 EX300】

说明:博文为大家争取福利,与清华大学出版社合作进行送书活动 图书:《RHCSA/RHCE 红帽Linux认证学习指南(第7版) EX200 & EX300》 一、好书推荐 图书介绍 《RHCSA/RHCE 红帽Linux认证学习指南(第7版) EX200 & E…...

当 Tubi 遇到 Ruby

有人说 Tubi 作为 RubyConf China 金牌赞助商,明明用极具吸引力的 Elixir 后端工程师岗位和高品质的 Elixir Meetup,“拐走了”一批又一批 Rubyist 投身于 Elixir 开发中,却依然让人想在 Tubi 展台前多停留一会儿。 为什么工程师、校友甚至 …...

【C++从0到王者】第二十四站:多态的底层原理

文章目录 前言一、虚函数表二、一道经典的例题三、深度剖析多态的条件之一:为什么必须是父类的指针或引用四、深度剖析多态的条件之二:为什么是虚函数的重写/覆盖?五、虚函数表的一些总结六、关于Func3的验证七、动态绑定与静态绑定八、总结 …...

Java从入门到精通24==》数据库、SQL基本语句、DDL语句

Java从入门到精通24》数据库、SQL基本语句、DDL语句 2023.8.27 文章目录 <center>Java从入门到精通24》数据库、SQL基本语句、DDL语句一、什么是数据库二、数据库的优缺点1、使用数据库的优点&#xff1a;2、使用数据库的缺点&#xff1a; 三、MySQL基本语句四、DDL语句 …...

学习ts(十)装饰器

定义 装饰器是一种特殊类型的声明&#xff0c;它能够被附加到类声明&#xff0c;方法&#xff0c;访问符&#xff0c;属性或参数上&#xff0c;是一种在不改变原类和使用继承的情况下&#xff0c;动态的扩展对象功能。 装饰器使用expression形式&#xff0c;其中expression必须…...

如何在 Opera 中启用DNS over HTTPS

DNS over HTTPS&#xff08;基于HTTPS的DNS&#xff09;是一种更安全的浏览方式&#xff0c;但大多数 Web 浏览器默认情况下不启用它。了解如何在 Opera 浏览器中启用该功能。 您可能不知道这一点&#xff0c;但您的网络浏览器并不像您希望的那样私密或安全。您会看到&#xff…...

STM32 F103C8T6学习笔记13:IIC通信—AHT10温湿度传感器模块

今日学习一下这款AHT10 温湿度传感器模块&#xff0c;给我的OLED手环添加上测温湿度的功能。 文章提供源码、测试工程下载、测试效果图。 目录 AHT10温湿度传感器&#xff1a; 特性&#xff1a; 连接方式&#xff1a; 适用场所范围&#xff1a; 程序设计&#xff1a; 设…...

QT基础使用:组件和代码关联(信号和槽)

自动关联 ui文件在设计环境下&#xff0c;能看到的组件可以使用鼠标右键选择“转到槽”就是开始组件和动作关联。 在自动关联这个过程中软件自动动作的部分 需要对前面头文件进行保存&#xff0c;才能使得声明的函数能够使用。为了方便&#xff0c;自动关联时先对所有文件…...

TCP最大连接数问题总结

最大TCP连接数量限制有&#xff1a;可用端口号数量、文件描述符数量、线程、内存、CPU等。每个TCP连接都需要以下资源&#xff0c;如图所示&#xff1a; 1、可用端口号限制 Q&#xff1a;一台主机可以有多少端口号&#xff1f;端口号与TCP连接&#xff1f;是否能修改&#x…...

【Docker】云原生利用Docker确保环境安全、部署的安全性、安全问题的主要表现和新兴技术产生

前言 Docker 是一个开源的应用容器引擎&#xff0c;让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的Linux或Windows操作系统的机器上,也可以实现虚拟化,容器是完全使用沙箱机制,相互之间不会有任何接口。 云原生利用Docker确保环境安全、部署的…...

explain各个字段代表的意思

id&#xff1a;联表查询是每个表的读取顺序&#xff0c;数字越大越先被读取。相同就需要通过table字段判断select_type&#xff1a;查询类型或者是其他操作类型&#xff08;PRIMARY、UNION、UNION RESULT等&#xff09;table&#xff1a;正在访问哪个表partitions&#xff1a;匹…...

【已解决】Windows10 pip安装报错:UnicodeDecodeError: ‘gbk‘ codec can‘t decode byte 0x98

环境&#xff1a;win10, Python3.9 在Pycharm安装YoloV5的依赖包时出现报错&#xff1a;UnicodeDecodeError: ‘gbk’ codec can’t decode byte 0x98 出现 ‘gbk’ codec can’t decode… 的报错一般是因为读取文件出现编码问题导致没法读取文件&#xff0c;因此可以在报错…...

goland 中的调试器 -- Evaluate

今天一个好朋友 找到我&#xff0c;问我关于goland中Evaluate 小计算器的使用方式&#xff0c;说实话&#xff0c;我在此之前也没用过这个东西&#xff0c;然后我就找一些相关文档&#xff0c;但是这类文档少的可怜&#xff0c;所以我就稍微研究一下&#xff0c;找找材料&#…...

你知道公司内部维基到底有哪些功能吗

维基指的是一种协作工作的平台&#xff0c;也就是开源的编辑系统。员工可以在企业维基里面进行存储、共享和协作之类的操作&#xff0c;将企业内部员工的知识共享聚集在一起。今天looklook将会详细讲讲公司内部维基具体到底有哪些功能&#xff0c;供大家参考。 公司内部维基的功…...

netdata监控服务器主机(包括Docker容器)

效果 Docker部署 创建挂载目录 mkdir -p /data/netdata/{netdatacache,netdatalib}docker运行 docker run -d --namenetdata \-p 19999:19999 \-v /data/netdata/netdatalib:/var/lib/netdata \-v /data/netdata/netdatacache:/var/cache/netdata \-v /etc/passwd:/host/etc…...

Mybatis学习|第一个Mybatis程序

1.创建一个数据库以及一个用户表&#xff0c;并插入三条数据用来测试 2.创建一个空的maven项目 在pom.xml中导入本次测试用到的三个依赖&#xff0c;mysql驱动、mybatis依赖、以及单元测试junit依赖 将这个 空的maven项目当成一个父项目&#xff0c;再创建一个空的maven子项目用…...

计算机网络MTU和MSS的区别

在计算机网络中&#xff0c;MTU代表最大传输单元&#xff08;Maximum Transmission Unit&#xff09;&#xff0c;而MSS代表最大分节大小&#xff08;Maximum Segment Size&#xff09;。 1.MTU&#xff08;最大传输单元&#xff09;&#xff1a; MTU是指在网络通信中&#x…...

免费的网站建设/seo排名优化软件价格

最近要搭建一个SVN服务器。简单安装之后&#xff0c;本地访问没有问题&#xff0c;但作为服务器肯定是需要HTTP访问。搜索之后&#xff0c;以下是我按照网上的资料搭建的过程&#xff0c;以备后用和参考。&#xff08;所有软件安装步骤略&#xff0c;没有特殊的&#xff0c;如果…...

宁波有做网站的地方吗/seo优化收费

一、JVM的安装和配置 一、下载JDK1.8的安装包 二、将JDK1.8的安装包复制到/opt/目录下 三、解压JDK1.8的安装包 tar zxvf jdk-8u65-linux-x64.tar.gz四、更改JDK1.8的文件夹名称 mv jdk1.8.0_65 jdk五、删除JDK1.8的安装包 rm -rf jdk-8u65-linux-x64.tar.gz六、配置JDK的…...

永安网站建设/百度移动点击排名软件

python 文件太多打不开文件夹&#xff0c;取样少量的文件&#xff0c; 建立同样的文件目录结构 python 文件太多打不开文件夹&#xff0c;取样少量的文件 - 无左无右 - 博客园 import os import shutil import randomroot_file "/media/algo/data_1/everyday/20230203-有…...

免费网站服务器/广州网络推广专员

传送门:bzoj4012 这题码调试就花了一中午和一下午。。。最后发现问题都是有地方没开longlonglong \ longlong longTAT。。。 法2的代码比较有技巧性(还不太熟。 题解 法1(点分树)&#xff1a; 首先点分治处理出v:v:v:每个重心到其所管辖子树中每个点的距离&#xff0c;压进…...

莱州教研室网站/百度云盘资源

git mercurialJDK团队希望通过Project Skara来研究JDK源代码管理的替代方案&#xff0c;该替代方案自2008年以来一直在使用Mercurial存储库。 “退休” Mercurial并选择Git是个好主意吗&#xff1f; 投票表决&#xff0c;看看Java冠军Stephen Colebourne对这次讨论要说些什么。…...

网站升级建设方案/云优客seo排名公司

Lock是java.util.concurrent.locks包下的一个接口 主要方法有&#xff1a; Lock接口的实现类 Lock相关实现类还可以定义公平锁&#xff0c;如ReentrantLock(boolean) package cn.itcats.thread.safe.Test1;import java.util.concurrent.locks.Lock; import java.util.concurre…...