JS中的变量和数据类型及用户输入详解

源码

variate.html<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>//声明变量var num ;//为变量赋值num = 123 ;//使用变量alert(num) ;//重新赋值num = 456 ;alert(num)</script>
</body>
</html>data-type.html<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>var num = 123; //1.数值型 numberconsole.log(typeof(num));//2 字符串型 stringvar str = '你好'; console.log(typeof(str));var str2 = '123';console.log(typeof(str2));//3 布尔型 booleanvar bool1 = true;var bool2 = false;console.log(typeof(bool1));console.log(typeof(bool2));//4 未定义 undefined 没有赋值的变量类型var a;console.log(typeof(a));//5 空 nullvar b = 123;b = null;console.log(typeof(b)) //object//6 对象型 objectvar obj1 = {};console.log(typeof(obj1));console.log(obj1);var obj2 = {name:"zhangsan",age:"18"};console.log(obj2);console.log(obj2.name);console.log(obj2.age);obj2.age = 22; console.log(obj2.age);// js中的输入var res = prompt("请输入:");alert(res);</script>
</body>
</html>

 

JS变量的使用[variate.html]

  1. 声明变量var num; 这一行代码声明了一个名为num的变量。在JavaScript中,var是声明变量的关键字。

  2. 为变量赋值num = 123; 这一行代码将数字123赋值给变量num。此时,变量num存储了一个整数值。

  3. 使用变量alert(num); 这一行代码使用alert函数弹出一个警告框,显示当前num变量的值。在第一次执行时,警告框会显示123

  4. 重新赋值num = 456; 这一行代码将变量num的值更新为456。这是变量的值被改变的一个例子,展示了JavaScript中变量的值是可以动态改变的。

  5. 再次使用变量alert(num) 这一行代码再次使用alert函数弹出一个警告框,由于之前将num的值更新为456,所以这次警告框会显示456

425f9eabbe594f608c95f31b11f6cc3b.png

b96339e6e18a42eaae670e7fc1a9ddd9.png

JS数据类型

在脚本中,定义了不同类型的变量,并使用console.log()函数和typeof操作符来输出变量的类型和值。

  1. 数值型 (number)

    • var num = 123; 定义了一个数值型变量num,并赋值为整数123
    • console.log(typeof(num)); 使用typeof操作符输出变量num的类型,结果是"number"
  2. 字符串型 (string)

    • var str = '你好'; 定义了一个字符串型变量str,并赋值为'你好'
    • console.log(typeof(str)); 输出变量str的类型,结果是"string"
    • var str2 = '123'; 定义了另一个字符串型变量str2,并赋值为'123'
    • console.log(typeof(str2)); 输出变量str2的类型,结果同样是"string"
  3. 布尔型 (boolean)

    • var bool1 = true; 定义了一个布尔型变量bool1,并赋值为true
    • var bool2 = false; 定义了另一个布尔型变量bool2,并赋值为false
    • console.log(typeof(bool1)); 和 console.log(typeof(bool2)); 分别输出这两个布尔型变量的类型,结果都是"boolean"
  4. 未定义 (undefined)

    • var a; 定义了一个变量a但没有赋值,它的值将是undefined
    • console.log(typeof(a)); 输出变量a的类型,结果是"undefined"
  5. 空值 (null)

    • var b = 123; 定义了一个变量b并赋值为整数123
    • b = null; 将变量b的值更新为null
    • console.log(typeof(b)); 输出变量b的类型,结果是"object"。这是一个JavaScript中的一个特殊行为,typeof操作符对于null值总是返回"object"
  6. 对象型 (object)

    • var obj1 = {}; 定义了一个空的对象obj1
    • console.log(typeof(obj1)); 输出对象obj1的类型,结果是"object"
    • var obj2 = {name:"zhangsan", age:"18"}; 定义了一个包含属性的对象obj2
    • console.log(obj2); 输出对象obj2及其属性。
    • console.log(obj2.name); 和 console.log(obj2.age); 分别输出对象obj2nameage属性的值。
    • obj2.age = 22; 更新对象obj2age属性为22
    • console.log(obj2.age); 输出更新后的age属性值。

当这个HTML文档在浏览器中运行时,console.log()函数的输出将会显示在浏览器的控制台(Console)中。这个网页本身不会在浏览器的可视区域显示任何内容。

39445682e6784dd2843be28a12d939ca.png

JS中的用户输入

var res = prompt("请输入:"); 这一行代码调用了prompt函数,该函数会弹出一个对话框,提示用户进行输入。对话框中显示的消息是"请输入:",这是一个提示性的文字,告诉用户需要输入一些信息。用户可以在弹出的对话框中输入文本,然后点击"确定"按钮继续。用户输入的内容将被存储在变量res中。

 

alert(res); 这一行代码调用了alert函数,该函数会弹出一个警告框,显示res变量中的值。如果用户在prompt对话框中输入了内容,并点击了"确定"按钮,alert函数就会显示用户输入的内容。如果用户点击了"取消"按钮,prompt函数将返回null,因此alert函数将显示一个空消息框。

561e50f97a3e4227b7685b8a844f730e.png2826ccc713224a10aec4ed9b7a0dbe2b.png 

 

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

从D盘调整空间增加到C盘而不丢失数据的3 种方法

越来越多的Windows 10笔记本电脑和台式机使用SSD作为系统盘&#xff0c;这对于提高计算机性能很有用&#xff0c;因为SSD的读写速度要快得多。但另一方面&#xff0c;SSD价格更高&#xff0c;因此比传统机械硬盘体积更小。当然C盘空间不足的可能性更大。在这种情况下&#xff0…

FFmpeg合并音视频文件操作备忘(mac版)

利用NDM嗅探插件从B站下载下来的文件是音视频分开的&#xff0c;用剪辑软件合并时发现导出时文件都特别大&#xff0c;于是使用FFmpeg处理 环境&#xff1a; MBP M1芯片版 系统 macOS Sonama 14.4.1 操作步骤&#xff1a; 一、官方下载链接&#xff1a;https://evermeet.cx/…

【Java开发指南 | 第九篇】访问实例变量和方法、继承、接口

读者可订阅专栏&#xff1a;Java开发指南 |【CSDN秋说】 文章目录 访问实例变量和方法继承接口 访问实例变量和方法 通过已创建的对象来访问成员变量和成员方法&#xff0c;如下所示&#xff1a; /* 实例化对象 */ Object referenceVariable new Constructor(); /* 访问类中…

【工位ubuntu的配置】补充

软件 安装桌面图标的问题 登录密码 root的密码为&#xff1a;19980719 按照如下的链接进行配置&#xff1a; https://blog.csdn.net/zhangmingfie/article/details/131102331?spm1001.2101.3001.6650.3&utm_mediumdistribute.pc_relevant.none-task-blog-2%7Edefault%7E…

【Qt】Qt安装包、源码、子模块(submodules)下载

1、Qt 4.0 ~ Qt5.14 Qt 4.0 ~ Qt5.14 离线安装包、源码和子模块(submodules)源码下载路径: https://download.qt.io/new_archive/qt/以Qt5.7.1为例,注意子模块都是源码,需要独立编译 2、Qt5.15 ~ Qt6.7 Qt5.15 ~ Qt6.7源码和子模块(submodules)源码下载路径: htt…

在Windows安装R语言

直接安装R语言软件 下载网址&#xff1a;R: The R Project for Statistical Computing 下载点击install R for the first time 通过Anaconda下载RStudio 提前下载好Anaconda 点击Anaconda Navigate 点击RStudio的Install下载就好了

HQL,SQL刷题,尚硅谷(中级)

目录 相关表结构&#xff1a; 1、order_info表 2、order_detail表 题目及思路解析&#xff1a; 第一题&#xff0c;查询各品类销售商品的种类数及销量最高的商品 第二题 查询用户的累计消费金额及VIP等级 第三题 查询首次下单后第二天连续下单的用户比率 总结归纳&#xff1a…

Ubuntu 传输文件

scp [选项] 源文件 目标路径 以下是一些常用的 scp 命令选项&#xff1a; -r&#xff1a;递归复制目录和子目录。 -P&#xff1a;指定远程 SSH 服务器的端口号。 -i&#xff1a;指定用于身份验证的私钥文件。 -p&#xff1a;保留源文件的时间戳、权限和所有者。 -v&#x…

vivado 使用 JTAG-to-AXI Master 调试核进行硬件系统通信

使用 JTAG-to-AXI Master 调试核进行硬件系统通信 JTAG-to-AXI Master 调试核为可自定义核 &#xff0c; 可在运行时生成 AXI 传输事务并驱动 FPGA 内部的 AXI 信号。该核支持所 有存储器映射型 AXI 接口和 AXI4-Lite 接口 &#xff0c; 并且可支持位宽为 32 或 64 …

Py深度学习基础|Numpy基础总结

注&#xff1a;本文来自菜鸟教程学习总结 一、数组属性 NumPy 的数组中比较重要 ndarray 对象属性有&#xff1a; 注意&#xff1a;使用reshape后&#xff0c;数组的结构&#xff08;即元素的排列顺序和内在连接&#xff09;没有改变&#xff0c;但因为返回的是一个视图&#…

FTP客户端Transmit 5 for Mac中文激活版

Transmit 5是一款功能强大的Mac FTP客户端软件&#xff0c;它由Panic公司开发&#xff0c;为用户提供简单、高效的文件传输体验。 Transmit 5 for Mac中文激活版下载 Transmit 5支持多种传输协议&#xff0c;如FTP、SFTP、WebDAV和Amazon S3等&#xff0c;满足用户不同的文件传…

Maven的dependencyManagement与dependencies区别

先说结论&#xff1a;Maven 使用dependencyManagement 元素来提供了一种管理依赖版本号的方式。 在maven多模块项目的pom文件中&#xff0c;有的小伙伴会发现最外层的pom文件和里面的pom文件有个地方不一样 如下图 父pom 子pom 一般来说是在maven的最外父工程pom文件里&…