当前位置:首页 > 文章列表 > 文章 > 前端 > JavaScript 基础知识:第 1 部分

JavaScript 基础知识:第 1 部分

来源:dev.to 2024-09-18 08:30:56 0浏览 收藏
推广推荐
免费电影APP ➜
支持 PC / 移动端,安全直达

在文章实战开发的过程中,我们经常会遇到一些这样那样的问题,然后要卡好半天,等问题解决了才发现原来一些细节知识点还是没有掌握好。今天golang学习网就整理分享《JavaScript 基础知识:第 1 部分》,聊聊,希望可以帮助到正在努力赚钱的你。

JavaScript 基础知识:第 1 部分

javascript 就像一罐蜂蜜。您可以将手指浸入其中并刷一口。很甜。太棒了。这是危险的。它可能很危险,就像锅里的热蜂蜜一样。

javascript 复杂吗?好吧,您应该在本摘录的末尾找到这个问题的答案(也包括其他部分)。我们可以问另一个问题。开发一个程序需要多少 javascript 知识?如果您了解数据和数据流,将会有所帮助。我需要什么数据以及如何构建它?我该如何处理这些数据?类似的事情。当你思考一个概念时,你会做或应该能够做。这本质上就是本材料的目的(不过我们没有忘记第一个问题,“javascript 复杂吗?”)。

我通常喜欢简短而详细的文章,但这次会很长,所以请系好安全带。

我们将在这一部分讨论数据类型和变量。

运行 javascript

之前在什么是 nodejs 上,我们创建了一个 hello world 程序。我们也会在这里做同样的事情。

要运行javascript程序,我们需要nodejs和要运行的程序(代码)。我们将使用一个名为 app.js 的文件。因此,创建一个名为 app.js 的文件并继续操作。 .js 扩展名表明它是一个 javascript 文件。我们已经讨论过这个问题了,所以我就到此为止。

node app.js

控制台日志

有一种简单的方法可以将文本(数据)打印到终端(屏幕),这是通过 console.log 完成的。就像我们的 hello world 程序一样。在文本编辑器中输入此代码。

console.log("hello, it's me, javascript");

我们在 ( 和 ) 之间放置的任何有效数据都将打印到终端。在我们的例子中,我们在屏幕上打印了一条文本,说:你好,是我,javascript。我们要打印的数据周围有双引号。这封引号使我们的数据成为一个字符串。

尝试将字符串打印(写入)到终端并感受一下。

为了避免怀疑,当您创建 app.js 时,请在输入代码时保存它,然后运行它。

细绳

字符串是用引号(双引号、单引号或反引号)括起来的值(数据)。字符串就是文本。你的名字、年级等都是字符串。字符串可以是短语、句子、段落、单词、字符等

示例

  • “lorem ipsum”
  • 'lorem ipsum'
  • lorem ipsum\
  • “哦!那个库是由ant fu开发的,一个狂热的开源者?”
  • “丹尼的妈妈是一位科技首席执行官”
  • “我想在字符串中使用单引号。那么使用双引号作为引号不是更好吗?”
  • '我想在字符串中使用双引号。单引号表示,“有一个名为 foo bar 的字符串”'
  • “我可以混合搭配单引号和反引号中的双引号”,john doe 的爸爸说。

上面的示例向您展示了如何使用字符串,并指出了在 javascript 中处理字符串的注意事项。对于初学者,您可以决定使用双引号或单引号。你选择。在进行字符串插值或遇到最后一个示例时使用反引号。只需知道,当您使用引号创建字符串时,起始引号必须匹配,并以相同的引号结束。所以不能用单引号开始,用双引号结束。

我们可以在引号分隔的字符串中使用引号(双引号、单引号或反引号),但随后我们必须对其进行转义。我们使用反斜杠,.

示例

console.log('we can use double quote in a double-quoted string, " by escaping');

现在,使用 console.log 记录上述字符串并编写您自己的字符串。

数字

数字示例:-3、5、10000、12.5等。它们可用于表示某项的计数或测量值。我的意思是,这就是数字。或者?

布尔值

布尔值,是一种值(数据)类型,就像字符串和数字一样。但是,布尔值要么为真,要么为假。某些条件是或不是的情况。

目的

javascript 中的对象是一种呈现键值对数据的方式。我们可以使用对象文字对某些项目的相关数据进行分组。为了创建对象文字,我们将此数据括在 { 和 } 中。让我们创建一个用户个人资料。

示例

我们将console.log用户个人资料。用户个人资料姓名、出生日期、职业、宠物数量、蛋白质重量(克)、工作等。每个键值都用逗号分隔。键后跟冒号,然后是值,形成键值对。通常,键是字符串(是的,我们将对象的键括在引号中)。您可以向其中添加更多键(属性)。

name 是一个字符串(我的意思是它的值)。 javascript 中有一个日期对象,但现在我们可以使用字符串来表示出生日期profession 也是一个字符串。 宠物数量蛋白质重量(以克为单位)是数字。 有工作 表示个人资料持有者是否有工作。所以它是一个布尔值。

{
    "name": "john doe",
    "date of birth": "2000-12-25",
    "profession": "software engineer",
    "number of pets": 2,
    "weight of protein in grams": 12.5,
    "has a job": true
}

这是一个对象(文字),详细介绍了 john doe 个人资料的内容。

现在我们可以console.log它了。

console.log({
  name: "john doe",
  "date of birth": "2000-12-25",
  profession: "software engineer",
  "number of pets": 2,
  "weight of protein in grams": 12.5,
  "has a job": true,
});

请注意,现在将键设置为字符串很重要。保持好奇心并使用字符串以外的其他东西作为键。你会学到很多东西。

计算器

数学是编程和科学的日常事务。我们不需要那么多数学。我们需要知道的是加法 (+)、减法 (-)、乘法 (*)、除法 (/),模 (%) 和指数 (**)。

从这里开始,模 (%) 和指数 (**) 对您来说是新的,因此我们将做一些数学运算。

// adding numbers with the plus
console.log(3 + 3); // answer = 6
console.log(1 + 2 + 4); // answer = 7

// subtraction with dash
console.log(6 - 3); // answer = 3
console.log(-16 - 3); // answer = -19

// multiplication with asterisk
console.log(5 * 3); // answer = 15
console.log(30 * 15); // answer = 450

// division with forward slash
console.log(30 / 5); // answer = 6
console.log(12.25 / 0.5); // answer = 24.5

// modulo (is the remainder after division is done) with the percentage sign (%)
console.log(5 % 2); // answer = 1
console.log(2 % 5); // answer = 2

// exponent with two asterisks (**)
console.log(5 ** 2); // answer = 5 * 5 = 25

变量

稍后,我们将在考虑为什么需要变量后讨论变量是什么。我认为您会根据您可能需要变量的原因来了解变量是什么。

让我们考虑一下到目前为止我们已经完成的字符串、数字、布尔值、对象和计算。我们如何获得这些值并对它们进行其他计算?我们使用一个变量。

因此我们可以将 3 + 3 的结果 6 存储或分配给变量。然后我们可以稍后使用该值。这样我们就可以跟踪变量的值(状态)。要知道,只要你看到一个变量,就有一个值。

变量是附加到值的标记、标签或名称。无论您在何处调用(引用)或使用该变量,都会引用该值。当我们说x为2时,x加上3,即x + 3。结果将是x + 3 = 2 + 3 = 5。

变量保存数据流中使用的数据。

cont 和 let
在 javascript 中,创建变量时使用 const 和 let(小写)。

  • 当你想要分配一个不应该或不会改变的值时使用 const
  • 当你想分配一个可能改变的值时使用let

让我们创建并使用一些变量

const name = "john doe";
const dateofbirth = "2000-12-25";
const profession = "software engineer";
const numberofpets = 2;
const weightofproteiningrams = 12.5;
const hasajob = true;

以上变量是常量。如果我们希望它们可以更改(重新分配),我们可以使用 let 而不是 const。这样我们就可以为这些变量分配不同的值。尝试为 const 变量重新赋值。

这就是我们所说的为变量重新赋值的意思。

const name = "john doe";
name = "peter dow";

或者

const name = "john doe";
name = "john dow";

将导致此错误消息:uncaught typeerror:分配给常量变量。

变量注释

  • 要创建变量,我们可以使用 const 和 let。
  • 它采用以下形式:let <变量名> = <值>;
  • <变量名称>是名称/标签/短语。看看上面的 const 变量。
  • <变量名>必须以字母字符或下划线(_)
  • 开头
  • <变量名>中不能有空格。由于空格,我的名字不能是变量名。
  • <变量名>中可以有数字。根据前面的规则,我们可以有name1、a1、_pet3_、max_life、max_life、maxlife、maxlife等
  • 变量名称最好描述或告知您它所保存的数据或变量的用途。
  • 这些变量:max_life、max_life、maxlife、maxlife,说同样的话,最大寿命
  • 使用了这种格式,maxlife,称为camelcasing。这个,maxlife就是pascalcasing。这个max_life,就是snake_casing。这个 max_life 用于创建常量。

我们可以为之前创建的配置文件对象创建一个变量。

const profile = {
  name: "John Doe",
  "date of birth": "2000-12-25",
  profession: "Software Engineer",
  "number of pets": 2,
  "weight of protein in grams": 12.5,
  "has a job": true,
};

console.log(profile);

结论

还有更多关于数据和数据流的讨论。到目前为止,我们已经了解了字符串、数字、布尔值和对象文字。正如我们所讨论的,变量是一种跟踪值的方法。语句 const x = 2 值 2 赋给变量 x。

等于符号=,是赋值运算符。这就是为什么我们说,变量 x 被赋值为 2.

我们还有更多关于 javascript 的内容可以讨论,例如:

  • 字符串插值及其方法要点
  • 数组
  • 控制结构(if 语句、循环)
  • 功能
  • 回调、承诺、异步和等待
  • 下一件大事

文中关于的知识介绍,希望对你的学习有所帮助!若是受益匪浅,那就动动鼠标收藏这篇《JavaScript 基础知识:第 1 部分》文章吧,也可关注golang学习网公众号了解相关技术文章。

版本声明
本文转载于:dev.to 如有侵犯,请联系study_golang@163.com删除
Win10设置默认应用在哪里修改 Win10设置默认应用在哪里修改
上一篇
Win10设置默认应用在哪里修改
Golang 函数类型安全如何提升代码质量
下一篇
Golang 函数类型安全如何提升代码质量
查看更多
最新文章
查看更多
课程推荐
  • 前端进阶之JavaScript设计模式
    前端进阶之JavaScript设计模式
    设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
    543次学习
  • GO语言核心编程课程
    GO语言核心编程课程
    本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
    516次学习
  • 简单聊聊mysql8与网络通信
    简单聊聊mysql8与网络通信
    如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
    500次学习
  • JavaScript正则表达式基础与实战
    JavaScript正则表达式基础与实战
    在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
    487次学习
  • 从零制作响应式网站—Grid布局
    从零制作响应式网站—Grid布局
    本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
    485次学习
查看更多
AI推荐
  • ChatExcel酷表:告别Excel难题,北大团队AI助手助您轻松处理数据
    ChatExcel酷表
    ChatExcel酷表是由北京大学团队打造的Excel聊天机器人,用自然语言操控表格,简化数据处理,告别繁琐操作,提升工作效率!适用于学生、上班族及政府人员。
    3213次使用
  • Any绘本:开源免费AI绘本创作工具深度解析
    Any绘本
    探索Any绘本(anypicturebook.com/zh),一款开源免费的AI绘本创作工具,基于Google Gemini与Flux AI模型,让您轻松创作个性化绘本。适用于家庭、教育、创作等多种场景,零门槛,高自由度,技术透明,本地可控。
    3428次使用
  • 可赞AI:AI驱动办公可视化智能工具,一键高效生成文档图表脑图
    可赞AI
    可赞AI,AI驱动的办公可视化智能工具,助您轻松实现文本与可视化元素高效转化。无论是智能文档生成、多格式文本解析,还是一键生成专业图表、脑图、知识卡片,可赞AI都能让信息处理更清晰高效。覆盖数据汇报、会议纪要、内容营销等全场景,大幅提升办公效率,降低专业门槛,是您提升工作效率的得力助手。
    3457次使用
  • 星月写作:AI网文创作神器,助力爆款小说速成
    星月写作
    星月写作是国内首款聚焦中文网络小说创作的AI辅助工具,解决网文作者从构思到变现的全流程痛点。AI扫榜、专属模板、全链路适配,助力新人快速上手,资深作者效率倍增。
    4566次使用
  • MagicLight.ai:叙事驱动AI动画视频创作平台 | 高效生成专业级故事动画
    MagicLight
    MagicLight.ai是全球首款叙事驱动型AI动画视频创作平台,专注于解决从故事想法到完整动画的全流程痛点。它通过自研AI模型,保障角色、风格、场景高度一致性,让零动画经验者也能高效产出专业级叙事内容。广泛适用于独立创作者、动画工作室、教育机构及企业营销,助您轻松实现创意落地与商业化。
    3833次使用
微信登录更方便
  • 密码登录
  • 注册账号
登录即同意 用户协议隐私政策
返回登录
  • 重置密码