JavaScript基础之输入输出与变量常量详解

输入和输出

输出和输入也可理解为人和计算机的交互,用户通过键盘、鼠标等向计算机输入信息,计算机处理后再展示结果给用户,这便是一次输入和输出的过程。

举例说明:如按键盘上的方向键,向上/下键可以滚动页面,按向上/下键这个动作叫作输入,页面发生了滚动了这便叫输出。

输出

JavaScript 可以接收用户的输入,然后再将输入的结果输出:

  • document.write(“要出的内容”): 向body内输出内容

    document.write("这是document.write")
    

在这里插入图片描述

注意:如果输出的内容写的是标签,也会被解析成网页元素

document.write("<h1>标题标签</h1>")

在这里插入图片描述

  • alert(“要出的内容”):页面弹出警告对话框

    alert("弹出警示框")
    

在这里插入图片描述

  • console.log(“控制台打印”): 控制台输出语法,程序员调试使用

    打开浏览器网页,点击F12快捷键,网页就会出现控制台
    请添加图片描述

console.log("这是控制台")

请添加图片描述

输入

prompt()

语法:

prompt("请输入内容")

向 prompt() 输入任意内容会以弹窗形式出现在浏览器中,一般提示用户输入内容。

  <script> 
    //  以弹窗形式提示用户输入姓名,注意这里的文字使用英文的引号
    prompt('请输入您的姓名:')
  </script>

运行结果
在这里插入图片描述

变量

在JavaScript中,变量是引用数字或字符串等值的标签。在计算机中,变量是计算机中用来存储数据的“容器”,它可以让计算机变得有记忆,通俗的理解变量就是使用【某个符号】来代表【某个具体的数值】(数据),同时变量这个容器的值是可以改变的。

所以,变量其主要作用是存取数据以及提供存放信息的容器

<script>
  // x 符号代表了 5 这个数值
  x = 5
  // y 符号代表了 6 这个数值
  y = 6
  //举例: 在 JavaScript 中使用变量可以将某个数据(数值)记录下来!
  // 将用户输入的内容保存在 num 这个变量(容器)中
  num = prompt('请输入一数字!')
  // 通过 num 变量(容器)将用户输入的内容输出出来
  alert(num)
  document.write(num)
</script>

声明

在使用变量之前,需要声明变量。

声明(定义)变量有两部分构成:声明关键字、变量名(标识符)

声明关键词

声明关键字是var关键字声明,在JavaScript的ES5版本中所有JavaScript变量都由var声明

说明:目前所讲的知识都是ES5版本中的知识,后续版本都是基于这版本后内容的延申。

变量名

变量名可以是任何有效的标识符。

变量名遵循以下规则:

  • 变量名称只能由字母(a-zA-Z)、数字(0-9)、下划线(_)和美元符号($)组成,不能包含空格。
  • 变量名称是以字母(a-zA-Z)、下划线(_)或美元符号($)开头,变量名称不能以数字开头
  • JavaScript的变量名区分大小写,例如 ,Sunsun,这两个就是不同的变量
  • 变量名不能是保留关键字

驼峰命名法

按照惯例,变量名使用驼峰命名法。

在JavaScript中,驼峰命名法(camel case)是一种常见的命名约定,用于命名变量、函数、属性等标识符。它包括两种形式:小驼峰命名法(lower camel case)和大驼峰命名法(upper camel case)。

  • 小驼峰命名法(lower camel case):第一个单词首字母小写后续单词的首字母大写。例如:firstName、lastName、firstNameAndLastName。
  • 大驼峰命名法(upper camel case):每个单词的首字母都大写。例如:FirstName、LastName、FirstNameAndLastName。

使用驼峰命名法可以使代码更易读、易写和易维护。

实例:

var firstName;
var myMessage;

赋值

声明(定义)变量相当于创造了一个空的“容器”,通过赋值向这个容器中添加数据,赋值也可以说对其变量初始化。

要初始化变量,请先指定变量名称,后跟等号(=)和值

语法:

var 变量名=;

变量的使用语法如下

请添加图片描述

实例:

var message;
message="123"

实例:同时声明和初始化变量

var message="123";

JavaScript允许使用单个语句同时声明两个或多个变量。要分隔两个变量声明,中间要使用英文逗号(“,”)

var message="hello world", number="123",word="hello";

同一个变量名多次赋值,后面的值会覆盖前面的值,你可以通过这分配不同的值来更改其值。

 // 赋值,将 18 这个数据存入了 age 这个“容器”中
	var age=18; // 这样 age 的值就成了 18
      //更新变量,变量名直接重新赋值
	 age=19;//age的值为19
    document.write(age)

变量名输出不能打双引号(“”)或单引号(‘’),多个变量名输出用英文逗号隔开。

 var str = 'hello world!'
  alert(str);    //变量名输出不能打引号
    
  //输出多个变量,要用逗号(,)隔开
  var name="tom",height="123"
   console.log(tom,height);

变量作用域

变量根据作用域可分为:

  • 全局变量
  • 局部变量

全局变量

可以在JavaScript脚本中的任何位置被调用,全局变量的作用域是当前文档中整个脚本区域

局部变量

只能在此变量声明语句所属的函数内部使用,局部变量的作用域仅为该函数体

声明变量时,要根据编程的目的决定将变量声明为全局变量还是局部变量。

一般而言,保存全局信息(如表格的原始大小、下拉框包含选项对应的字符串数组等)的变量需声明为全局变量。而保存临时信息(如待输出的格式字符串、数学运算中间变量等)的变量则声明为局部变量

弱类型

JavaScript脚本语言跟其他编程语言一样,其变量都有数据类型。但与此不同的是,JavaScript语言是弱类型语言,在变量声明时不需显式地指定其数据类型,变量的数据类型将根据变量的具体内容推导出来,且根据变量内容的改变而自动改变,而强类型语言在变量声明时必须显式地指定其数据类型。

变量声明时不需显式指定其数据类型是JavaScript脚本语言的优点也是缺点

优点是编写脚本代码时不需要指明数据类型,使变量声明过程简单明了;缺点是有可能造成因微妙的拼写不当而引起致命的错误。

常量

概念:常量是保存一个不会改变的值。使用 const 声明的变量称为“常量”。

命名规范:和变量一致

一旦定义了变量,就无法更改其值。

const PI = 3.14

注意: 常量不允许重新赋值,声明的时候必须赋值(初始化)

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

C语言实现插入排序算法(附带源代码)

插入排序 插入排序&#xff08;英语&#xff1a;Insertion Sort&#xff09;是一种简单直观的排序算法。它的工作原理是通过构建有序序列&#xff0c;对于未排序数据&#xff0c;在已排序序列中从后向前扫描&#xff0c;找到相应位置并插入。插入排序在实现上&#xff0c;通常…

opencv012 滤波器04 中值滤波,双边滤波

中值滤波 取中位数&#xff0c;可以处理椒盐噪音 CV自带medianBlur函数dst cv2.medianBlur(src, ksize) 参数说明&#xff1a;1.src: 需要滤波的图片&#xff1b;2.ksize&#xff1a;核大小&#xff0c;必须是比1大的奇数【举个例子&#xff1a;3&#xff0c;5&#xff0c;7……

【RT-DETR有效改进】 | 主干篇 | RevColV1可逆列网络(特征解耦助力小目标检测)

前言 大家好&#xff0c;这里是RT-DETR有效涨点专栏。 本专栏的内容为根据ultralytics版本的RT-DETR进行改进&#xff0c;内容持续更新&#xff0c;每周更新文章数量3-10篇。 专栏以ResNet18、ResNet50为基础修改版本&#xff0c;同时修改内容也支持ResNet32、ResNet101和PP…

JDBC(Java DataBase Connectivity )

图片来源&#xff1a;动力节点老杜的JDBC视频讲解 JDBC&#xff08;Java DataBase Connectivity &#xff09; 一、JDBC 的本质二、开始前的准备工作三、关于 JDBC 中的事务四、JDBC 编程六步1.注册驱动2.获取连接3.获取数据库操作对象4.执行SQL语句5.处理结果查询集6.释放资源…

SpringBoot_基础

学习目标 基于SpringBoot框架的程序开发步骤 熟练使用SpringBoot配置信息修改服务器配置 基于SpringBoot的完成SSM整合项目开发 一、SpringBoot简介 1. 入门案例 问题导入 SpringMVC的HelloWord程序大家还记得吗&#xff1f; SpringBoot是由Pivotal团队提供的全新框架&…

docker指令存档

目录 Docker 1、概念 2、架构图 3、安装 4、Docker怎么工作的&#xff1f; 5、Docker常用命令 帮助命令 镜像命令 1、查看镜像 2、帮助命令 3、搜索镜像 4、拉取镜像 5、删除镜像 容器命令 1、启动 2、查看运行的容器 3、删除容器 4、启动&停止 其他命令…

苹果Find My市场需求火爆,伦茨科技ST17H6x芯片助力客户量产

苹果发布AirTag发布以来&#xff0c;大家都更加注重物品的防丢&#xff0c;苹果的 Find My 就可以查找 iPhone、Mac、AirPods、Apple Watch&#xff0c;如今的Find My已经不单单可以查找苹果的设备&#xff0c;随着第三方设备的加入&#xff0c;将丰富Find My Network的版图。产…

蓝桥杯备战——3.定时器前后台

1.STC15F2k61S2的定时器 阅读STC15系列的手册&#xff0c;我们可以看到跟STC89C52RC的定时器还是有不同之处的&#xff1a; 由上图可以看到我们可以通过AUXR寄存器直接设置定时器的1T/12T模式了 在定时器0/1模式上也可以设置为16位自动重装载。 另外需要注意IAP15F2K61S2只有…

python 学习之 re库的基本使用(正则匹配)上

目录 一、基本用法 二、函数介绍 1、match函数 2、search 函数 3、compile 函数 4、findall 和 finditer 函数 5、sub 函数和 subn 函数 6、split 函数 一、基本用法 首先我们需要引入 re 库 代码基本框架使用两行代码实现 测试代码&#xff1a; import reret re.m…

Linux管道学习(无名管道)

目录 1、概述 2、管道的创建 3、管道读写行为 3.1、管道读 在linux中管道有两种&#xff0c;一是无名管道&#xff08;匿名管道&#xff09;&#xff0c;第二种是有名管道&#xff1b;无名管道主要用于有血缘关系的父子进程间通信&#xff0c;有名管道则不受该限制&#xf…

描绘未知:数据缺乏场景的缺陷检测方案

了解更多方案内容&#xff0c;欢迎您访问官网&#xff1a;neuro-T | 友思特 机器视觉 光电检测&#xff1b;或联系销售经理&#xff1a;18124130753 导读&#xff1a; 深度学习模型帮助工业生产实现更加精确的缺陷检测&#xff0c;但其准确性可能受制于数据样本的数量。友思特…

Gradle学习笔记:Gradle的简介、下载与安装

文章目录 一、什么是Gradle二、为什么选择Gradle三、下载并安装Gradle四、Gradle的bin目录添加到环境变量五、测试Gradle是否安装正常 一、什么是Gradle Gradle是一个开源构建自动化工具&#xff0c;专为大型项目设计。它基于DSL&#xff08;领域特定语言&#xff09;编写&…

科大讯飞 再次引爆Ai

去年「科大讯飞版ChatGPT」星火大模型刚上线的时候&#xff0c;小编给大家推荐过一波&#xff0c;演示了其强大的功能&#xff0c;不少小伙伴都立马申请体验了一把&#xff0c;有小伙伴还私信我说功能非常强大&#xff0c;工作效率提高不少&#xff0c;支持国产大模型之类赞扬。…

idea 打包跳过测试

IDEA操作 点击蓝色的小球 手动命令 mvn clean package -Dmaven.test.skiptrue

音频格式之AAC:(2)AAC封装格式ADIF,ADTS,LATM,extradata及AAC ES存储格式

系列文章目录 音频格式的介绍文章系列&#xff1a; 音频编解码格式介绍(1) ADPCM&#xff1a;adpcm编解码原理及其代码实现 音频编解码格式介绍(2) MP3 &#xff1a;音频格式之MP3&#xff1a;(1)MP3封装格式简介 音频编解码格式介绍(2) MP3 &#xff1a;音频格式之MP3&#x…

unity学习笔记----游戏练习07

一、僵尸攻击和植物的掉血和销毁 当僵尸接触到植物开始攻击时会持续削减植物的血量&#xff0c;当植物血量为零时就销毁当前植物。 在plantManager中&#xff0c; 为植物添加一个血量HP 100&#xff0c; public int HP 100; 在写一个减少血量的方法&#xff0c;来减少血…

【RabbitMQ】交换机的概念及使用

一、引言 1、什么是交换机 RabbitMQ中&#xff0c;交换机是一个核心概念&#xff0c;主要用来将生产者生产出来的消息&#xff0c;传送到对应的队列中。实际上&#xff0c;生产者生产的消息从不会直接发送到队列&#xff0c;而是发送到交换机。交换机一方面接收来自生产者的消…

golang入门

学习方法 1、在实践中学 2、适当的囫囵吞枣&#xff0c;有可能学到后面&#xff0c;对前面的疑问焕然大悟 3、注重整体&#xff0c;刚开始不要去扣细节 安装 需要配置3个环境变量&#xff0c;如果.msi文件安装时设置好了就不需要了&#xff0c;自己可以检查下 GOROOT&…

【Unity】粒子贴图异常白边问题

从PS制作的黑底&#xff0c;白光的贴图。放入Unity粒子中&#xff0c;拉远看会有很严重的白边&#xff0c;像马赛克一样。 材质使用&#xff1a;Mobile/Particles/Additive 经测试只使用一张黑色的图片&#xff0c;也会有白边。 解决方案&#xff1a; 关闭黑色底&#xf…

web前端之不一样的居中方式、解决tabBar选项卡居中问题、css支持嵌套、auto

MENU 前言htmlstyle效果 前言 这里不能使用justify-content: center;&#xff0c;因为在小屏幕上&#xff0c;这种方式无法显示最前面的两个tabBar。 html <div id"box" class"d_f o_a mt_50 mb_50 ml_20 mr_20"><div class"ws_n">…