前端学习<四>JavaScript基础——03-常量和变量

news2024/10/10 14:29:01

常量(字面量):数字和字符串

常量也称之为“字面量”,是固定值,不可改变。看见什么,它就是什么。

常量有下面这几种:

  • 数字常量(数值常量)

  • 字符串常量

  • 布尔常量

  • 自定义常量

数字常量

数字常量非常简单,直接写数字就行,不需要任何其他的符号。既可以是整数,也可以是浮点数。

例如:

 // 不需要加引号
 alert(996); // 996是整数
 alert(3.14); // 3.14是浮点数(即带了小数)

字符串常量

字符串常量就是用单引号或双引号括起来的内容。可以是单词、句子等,一定要加引号。在JS中,只要是单引号或双引号括起来的内容,都是字符串常量。

例如:

 console.log('996');
 ​
 console.log("千古壹号,永不止步");

温馨提示:996 是数字,'996'是字符串。

布尔常量

布尔常量就是表达或者,在JS中用 true 和 false 来表达。

布尔字面量举例:

 if (true) {
     console.log('如果为真,就走这里面的代码);
 }

自定义常量:const

自定义常量是ES6中新增的语法。它的语法格式是这样的:

 const 常量名称 = 常量取值;

举例:

 const name = '千古壹号'; // 定义常量name,它的取值是 千古壹号
 ​
 // name =  '许嵩'; // 既然 name 是常量,所以这一行是错误的写法,因为 name 无法被修改为其他的值
 ​
 console.log(name); // 打印结果:千古壹号

后续我们讲ES6语法的时候,会深入学习 const 用法。

开发技巧:用变量定义常量

我们一般不会直接使用常量,否则会导致代码冗余、不易维护。如果多个地方要用到同一个常量,那就建议事先定义一个变量,用来保存这个常量;然后在需要的地方去引用这个变量就行了。另外,当我们学习了ES6中的 const 之后,还可以使用自定义常量达到目的。

变量的概念

变量表示可以被修改的数据。我们通过「变量名」获取数据,甚至修改数据。

变量还可以用来保存常量。

本质:变量是程序在内存中申请的一块用来存放数据的空间。打个比方,超市里的储物格就是变量, 在不同的时间段里, 储物格中存储的数据可以不一样。

变量的定义和赋值

定义变量是在告诉浏览器,我们需要一块内存空间,相当于生成超市里的储物格。

给变量赋值就是往相当于往储物格里塞东西,可能今天上午塞的是面包🍞,下午就换成了蛋糕🍰。

变量的定义/声明(ES5)

在 ES6 语法之前,统一使用var关键字来声明一个变量。比如:

 var name; // 定义一个名为 name 的变量。name是变量名。

var 是英语“variable”变量的缩写。后面要加一个空格,空格后面的东西就是“变量名”。

PS:在 JavaScript 中,永远都是用 var 来定义变量(在 ES6 之前),这和 C、Java 等语言不同。

变量的定义/声明(ES6)

在 ES6 语法及之后的版本里,可以使用 constlet关键字来定义一个变量

 const name; // 定义一个常量
 ​
 let age; // 定义一个变量

如果你想定义一个常量,就用 const;如果你想定义一个变量,就用 let。

变量的赋值

变量赋值举例:

 name = '千古壹号';

综合起来,变量的定义、赋值、取值,举例如下:

// 定义:声明一个变量
var num;
// 赋值:往变量中存储数据
num = 996;
// 取值:从变量中获取存储的数据
console.log(num);

合并写法

变量的定义和赋值,还可以合并写在一起,是实战中常用的写法。举例如下:

var a = 100; // ES5语法
console.log(a);

const b = hello; // ES6 语法

let c = world; // ES6 语法
c = qianguyihao; // 修改 变量 C 的值

定义一个变量并赋值, 我们称之为变量的初始化。如下图所示:

  • 定义变量:var 就是一个关键字,用来定义变量。所谓关键字,就是有特殊功能的单词。

  • 变量赋值:等号表示赋值,将等号右边的值,赋给左边的变量。

  • 变量名:我们可以给变量起个名字。

变量的初始化【重要】

第一次给变量赋值,称之为“变量的初始化”,这个概念非常重要。第二次给这个变量赋值(也就是修改这个变量的值)就不叫初始化了。

一个变量如果没有进行初始化(只声明,不赋值),那么这个变量中存储的值是undefined,这个知识点必须知道。

变量的初始化,可以有两种形式,如下。

形式1:先定义,在赋值。举例:

var name;
name = 'qianguyhihao';

形式2:在定义的同时进行初始化。也就是上一小段讲的“合并写法”。举例:

var name = 'qianguyihao';

变量定义和赋值的补充

修改变量的值

一个变量被重新复赋值后,它原有的值就会被覆盖,变量值将以最后一次赋的值为准。

举例:

var a = 100;
a = 110;

console.log(a); // 打印结果:110。因为 110 覆盖了 100

同时定义多个变量

1、同时定义多个变量时,只需要写一个 var, 多个变量名之间用英文逗号隔开。举例:

// 同时定义多个变量
var num1, num2;

2、定义多个变量的同时,分别进行初始化。举例:

// 定义多个变量的同时,进行初始化
var num1 = 10, num2 = 20;

如果多个变量初始化的初始化值都是一样的,则可以这样简写:

var num1, num2;
num1 = num2 = 10; // 重点在这一行

console.log(num1); // 10
console.log(num2); // 10

上面的写法和下面的写法是有区别的:(注意看打印结果)

var num1, num2 = 10;

console.log(num1); // undefined
console.log(num2); // 10

变量之间可以相互赋值

var num1, num2;
num1 = 10;
num2 = num1; // 把 num1 的值拷贝一份,赋值给 num2
console.log(num2); // 10

变量如果重复定义

在ES5中,如果用 var 定义了同名变量,那么,后定义的变量,会覆盖先定义的变量。举例:

var name = '许嵩';
var name = '千古壹号'; // 这里会重新定义一个新的变量 name

console.log(name); // 千古壹号

变量声明和赋值的特殊情况

变量建议先声明,再使用;否则可能会产生意想不到的结果。具体如下。

写法 1、先声明,再赋值:(正常)

var a;
a = 100;
console.log(a); // 打印结果:100

写法 2、不声明,直接赋值:(正常)

a = 100;
console.log(a); // 打印结果:100

写法 3、只声明,不赋值:(注意,打印 undefined)

var a;
console.log(a); // 打印结果:undefined

写法 4、不声明,不赋值,直接使用:(会报错)

console.log(a); // 会报错

控制台会报错:

补充:写法 1 和写法 2 虽然都正常,但这两种写法是有区别的,等以后学习了「变量提升」的概念就明白了。大多数情况下,我们都是采用的写法 1。

举例

举例:交换两个变量的值

代码实现:

var a1 = 100;
var a2 = 200;

var temp;

temp = a1;
a1 = a2;
a2 = temp;

最后

关于变量的命名规则,将在下一篇文章里讲。

---

创作不易,你的赞赏和认可,是我更新的最大动力

写在最后:希望大家可以点个关注点个赞,这对up真的很重要!谢谢!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1568029.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

C#编写MQTT客户端软件

主要参考C#MQTT编程06--MQTT服务器和客户端(winform版)_c#mqttserver-CSDN博客 但由于使用的.NET版本和MQTT库版本存在差异,因此有些不同。 MQTT协议内容在此不做描述,仅介绍VS使用C#的实现过程。本次使用VS2015,.netframwork4.6。 C#语言本身…

从零到一:基于 K3s 快速搭建本地化 kubeflow AI 机器学习平台

背景 Kubeflow 是一种开源的 Kubernetes 原生框架,可用于开发、管理和运行机器学习工作负载,支持诸如 PyTorch、TensorFlow 等众多优秀的机器学习框架,本文介绍如何在 Mac 上搭建本地化的 kubeflow 机器学习平台。 注意:本文以 …

STM32单片机智能电表交流电压电流程序设计(电流 电压互感器TV1005M+TA1005M)

资料下载地址:STM32单片机智能电表交流电压电流程序设计(电流 电压互感器TV1005MTA1005M) 1、摘要 5、基于STM32F103单片机智能电表交流电压电流设计 本设计由STM32单片机核心板电路交流电压电流检测模块电路WIFI模块电路指示灯电路组成。 1、通过电压互感器TV100…

【Canavs与艺术】绘制蓝白绶带大卫之星勋章

【图例】 【代码】 <!DOCTYPE html> <html lang"utf-8"> <meta http-equiv"Content-Type" content"text/html; charsetutf-8"/> <head><title>用Canvas绘制蓝白绶带大卫之星勋章</title><style type&quo…

计算机网络—TCP协议详解:特性、应用(2)

&#x1f3ac;慕斯主页&#xff1a;修仙—别有洞天 ♈️今日夜电波&#xff1a;マリンブルーの庭園—ずっと真夜中でいいのに。 0:34━━━━━━️&#x1f49f;──────── 3:34 &#x1f504; ◀️…

我愿把这个网站成为全球最强AI网站!弄100多个AI伺候你??

家人们&#xff0c;你们猜我发现了什么牛逼的AI网站&#xff1f;&#xff1f; 直接上图&#xff1a; 这个网站&#xff0c;聚合了国内外100多个顶尖的AI&#xff0c;包括了OpenAI家的GPT3.5、GPT4、GPT4V、GPT4.5系列&#xff0c;以及Anthropic家的Claude3 Opus、Claude3 Sone…

Spark-Scala语言实战(11)

在之前的文章中&#xff0c;我们学习了如何在spark中使用RDD中的cartesian,subtract最终两种方法。想了解的朋友可以查看这篇文章。同时&#xff0c;希望我的文章能帮助到你&#xff0c;如果觉得我的文章写的不错&#xff0c;请留下你宝贵的点赞&#xff0c;谢谢。 Spark-Scal…

如何系统地自学Python

1、如何系统地自学Python 小白的话可以快速过一下某马&#xff0c;某谷。 主要关注Python有什么集合&#xff0c;里面的集合怎么使用 然后再找一个Python爬虫实战视频&#xff0c;先跟着视频敲一遍代码&#xff0c;然后再尝试自己做一遍 然后再找一个Python服务开发视频&am…

redis乱码\xac\xed\x00\x05t\x00H解决

发现数据库乱码&#xff1a; 这数据库是来自rdids队列list实现的一个简单队列&#xff0c;停止使用该list的服务&#xff0c;查看里面的值&#xff0c;发现 乱码\xac\xed\x00\x05t\x00H&#xff0c;如下图&#xff1a; 很明发送数据端的问题&#xff0c;检查代码&#xff1a; …

如何保持数据一致性

如何保持数据一致性 数据库和缓存&#xff08;比如&#xff1a;redis&#xff09;双写数据一致性问题&#xff0c;是一个跟开发语言无关的公共问题。尤其在高并发的场景下&#xff0c;这个问题变得更加严重。 问题描述&#xff1a; 1.在高并发的场景中&#xff0c;针对同一个…

【python】python新闻内容zhua取分析词云可视化(源码)【独一无二】

&#x1f449;博__主&#x1f448;&#xff1a;米码收割机 &#x1f449;技__能&#x1f448;&#xff1a;C/Python语言 &#x1f449;公众号&#x1f448;&#xff1a;测试开发自动化【获取源码商业合作】 &#x1f449;荣__誉&#x1f448;&#xff1a;阿里云博客专家博主、5…

Redis的基础操作

目录 一、Redis命令工具 1.redis-cli 命令行工具 2.redis-benchmark测试工具 3.Redis数据库五大类型 1、String 2、List 3、Hash&#xff08;散列类型&#xff09; 4、set无序集合 5、sorted set 二、Redis数据库常用命令 1、set与get的使用 2.查看数据库中键的情况…

深度学习:神经网络模型的剪枝和压缩简述

深度学习的神经网路的剪枝和压缩&#xff0c;大致的简述&#xff0c; 主要采用&#xff1a; network slimming&#xff0c;瘦身网络... 深度学习网络&#xff0c;压缩的主要方式&#xff1a; 1.剪枝&#xff0c;nerwork pruing&#xff0c; 2.稀疏表示&#xff0c;sparse rep…

基于向量数据库搭建自己的搜索引擎

前言【基于chatbot】 厌倦了商业搜索引擎搜索引擎没完没了的广告&#xff0c;很多时候&#xff0c;只是需要精准高效地检索信息&#xff0c;而不是和商业广告“斗智斗勇”。以前主要是借助爬虫工具&#xff0c;而随着技术的进步&#xff0c;现在有了更多更方便的解决方案&…

2024-HW --->SSRF

这不是马上准备就要护网了嘛&#xff0c;如火如荼的报名ing&#xff01;&#xff01;&#xff01;那么小编就来查缺补漏一下以前的web漏洞&#xff0c;也顺便去收录一波poc&#xff01;&#xff01;&#xff01;&#xff01; 今天讲的主人公呢就是SSRF&#xff0c;以前学的时候…

QA测试开发工程师面试题满分问答5: 内存溢出和内存泄漏问题

概念阐述 内存溢出&#xff08;Memory Overflow&#xff09;和内存泄漏&#xff08;Memory Leak&#xff09;是与计算机程序中的内存管理相关的问题&#xff0c;它们描述了不同的情况。 内存溢出是指程序在申请内存时&#xff0c;要求的内存超出了系统所能提供的可用内存资源…

不到2000字,轻松带你搞懂STM32中GPIO的8种工作模式

大家好&#xff0c;我是知微&#xff01; 学习过单片机的小伙伴对GPIO肯定不陌生&#xff0c;GPIO &#xff08;general purpose input output&#xff09;是通用输入输出端口的简称&#xff0c;通俗来讲就是单片机上的引脚。 在STM32中&#xff0c;GPIO的工作模式被细分为8种…

N1912A安捷伦N1912A功率计

181/2461/8938产品概述&#xff1a; 安捷伦N1912A双通道P系列宽带功率传感器为R&D和制造工程师提供精确和可重复的功率测量&#xff0c;应用市场包括航空航天和国防&#xff08;雷达&#xff09;、无线通信和无线802.11a/b/g网络。该仪表/传感器组合提供的测量包括峰值功率…

XXLJob中GLUE模式实现在线编写java/shell/python/php/nodejs/powerShell---SpringCloud工作笔记202

1.起因: 之前就一直想实现类似的功能,今天总于找到有可以参考的东西了,这个思路可以帮助实现这种功能. 2.获得灵感 就是:我想实现通过在线编写代码,来扩展我们平台的能力,这样随着业务的扩展,不用我们每次都修改了代码,再去部署,这样就比较麻烦,今天偶尔发现,对于xxljob来说.有…

React 入门

一、官网地址 英文官网: https://reactjs.org/中文官网: https://react.docschina.org/ 二、React 特点 声明式编码组件化编码React Native 编写原生应用高效&#xff08;优秀的 Diffing 算法&#xff09;高效的原因&#xff1a;1.使用虚拟DOM&#xff0c;不总是直接操作页面…