JavaScript输入输出、变量、数据类型

简介: JavaScript输入输出、变量、数据类型

二、输入输出

2.1.输出方式

💡💡
两种输出方式:

  • alert(msg)
  • 使用 console.log() 写入到浏览器的控制台。
 alert('我是编程语言,来控制电脑网页弹出你好');
 
 console.log(1+2);

 // alert 弹出警示框 输出的 展示给用户的
    alert('计算的结果是');
 // console 控制台输出 给程序员测试用的  
    console.log('我是程序员能看到的');
2.2.输入方式

prompt(info)

        // 这是一个输入框
        prompt('请输入您的年龄');

三、注释

3.1.单行注释
  • 💡💡单行注释:
// 我是一行文字,不想被 JS引擎 执行,所以 注释起来

// 用来注释单行文字( 快捷键 ctrl + / )

3.2.多行注释
  • 💡💡多行注释:
/*
  123
  456
  789
*/
  • / / 用来注释多行文字( 默认快捷键 alt + shift + a )
  • 快捷键修改为: ctrl + shift + /
  • vscode  首选项按钮  键盘快捷方式  查找 原来的快捷键  修改为新的快捷键  回车确认

四、变量

4.1.什么是变量

💡💡
变量:

变量是用于存放数据的容器。 我们通过 变量名 获取数据,甚至数据可以修改。

变量的本质:

变量是内存里的一块空间,用来存储数据。变量是内存里的一块空间,用来存储数据。
4.2.变量的语法规范

💡💡
声明多个变量,及声明变量的特殊情况

        // 1.声明单个变量
        var name = '刘亦菲';
        console.log(name);
        name = '迪丽热巴';
        console.log(name);
        // 2. 声明多个变量
        var age = 18,
            address = '火影村',
            gz = 2000;
        // 3. 声明变量的特殊情况
        // 3.1 只声明不赋值 结果是?  程序也不知道里面存的是啥 所以结果是 undefined  未定义的
        var sex;
        console.log(sex); // undefined
        // 3.2  不声明 不赋值 直接使用某个变量会报错滴
        // console.log(tel);
        // 3.3 不声明直接赋值使用
        qq = 110;
        console.log(qq);
4.3.变量的基本使用

💡💡
var声明变量

 // 1. 声明了一个age 的变量 
        var age;
        // 2. 赋值  把值存入这个变量中
        age = 18;
        // 3. 输出结果 
        console.log(age);
        // 4. 变量的初始化 
        var name = '刘亦菲';
        console.log(name);

五、数据类型

5.1.简单数据类型

💡💡:

  1. 字符串(String)
字符串类型,双引号 "" 和 单引号''
var strMsg = "我爱北京天安门~";  // 使用双引号表示字符串
var strMsg2 = '我爱吃猪蹄~';    // 使用单引号表示字符串
  • 字符串拼接:
多个字符串之间可以使用 + 进行拼接,其拼接方式为 字符串 + 任何类型 = 拼接之后的新字符串
拼接前会把与字符串相加的任何类型转成字符串,再拼接成一个新的字符串
        // 1. 检测获取字符串的长度 length 
        var str = 'my name is andy';
        console.log(str.length); // 15
        // 2. 字符串的拼接 +  只要有字符串和其他类型相拼接 最终的结果是字符串类型
        console.log('沙漠' + '骆驼'); // 字符串的 沙漠骆驼
  • + 号总结口诀:数值相加 ,字符相连
  • 字符串拼接加强
         var age = 19;
        console.log('我今年age岁');
        // 我们变量不要写到字符串里面,是通过和 字符串相连的方式实现的
        console.log('我今年' + age + '岁');

        // 输出  我今年19岁了
  1. 数字(Number)
整形值和浮点型值,数字类型既可以用来保存整数值,也可以保存小数(浮点数)
var age = 21;       // 整数
var Age = 21.3747;  // 小数
  1. 布尔(Boolean)
布尔(逻辑)只能有两个值:true 或 false。
var x=true;
var y=false;
  1. 空(Null)
var a = Null; 声明了a为空值
var vari = null;
console.log('你好' + vari);  // 你好null
console.log(11 + vari);     // 11
console.log(true + vari);   //  1
  1. 未定义(Undefined)
var a;声明了a但是没给它值,所以a = Undefined
var variable;
console.log(variable);           // undefined
console.log('你好' + variable);  // 你好undefined
console.log(11 + variable);     // NaN
console.log(true + variable);   //  NaN
5.2. 获取检测变量的数据类型

💡💡:

  • typeof 可用来获取检测变量的数据类型
var num = 18;
console.log(typeof num) // 结果 number  
var str = 'pink';
console.log(typeof str); // string
var flag = true;
console.log(typeof flag); // boolean
var vari = undefined;
console.log(typeof vari); // undefined
var timer = null;
console.log(typeof timer); // object

其它类型:
在这里插入图片描述

5.3.数据类型转换

💡💡:

把一种数据类型的变量转换成另外一种数据类型。
  1. 转换为字符串类型

在这里插入图片描述

  • 第三种使用更多,也称为隐式转换。
  1. 转换为数字型

在这里插入图片描述

         // var age = prompt('请输入您的年龄');
        // 1. parseInt(变量)  可以把 字符型的转换为数字型 得到是整数
        // console.log(parseInt(age));
        console.log(parseInt('3.14')); // 3 取整
        console.log(parseInt('3.94')); // 3 取整
        console.log(parseInt('120px')); // 120 会去到这个px单位
        console.log(parseInt('rem120px')); // NaN
        // 2. parseFloat(变量) 可以把 字符型的转换为数字型 得到是小数 浮点数
        console.log(parseFloat('3.14')); // 3.14
        console.log(parseFloat('120px')); // 120 会去掉这个px单位
        console.log(parseFloat('rem120px')); // NaN
  1. 转换为布尔型

在这里插入图片描述

  • 代表空、否定的值会被转换为 false ,如 ''、0、NaN、null、undefined
  • 其余值都会被转换为 true
         console.log(Boolean('')); // false
        console.log(Boolean(0)); // false
        console.log(Boolean(NaN)); // false
        console.log(Boolean(null)); // false
        console.log(Boolean(undefined)); // false
相关文章
|
18天前
|
JavaScript 前端开发
JavaScript基础知识-变量的声明提前
关于JavaScript变量声明提前特性的基础知识介绍。
28 0
JavaScript基础知识-变量的声明提前
|
18天前
|
JavaScript 前端开发
JavaScript基础知识-基本数据类型和引用数据类型
关于JavaScript基础知识的文章,主要介绍了基本数据类型和引用数据类型。
30 2
JavaScript基础知识-基本数据类型和引用数据类型
|
2天前
|
存储 JavaScript 对象存储
js检测数据类型有那些方法
js检测数据类型有那些方法
|
1月前
|
JavaScript 前端开发
JavaScript基础&实战(1)js的基本语法、标识符、数据类型
这篇文章是JavaScript基础与实战教程的第一部分,涵盖了JavaScript的基本语法、标识符、数据类型以及如何进行强制类型转换,通过代码示例介绍了JS的输出语句、编写位置和数据类型转换方法。
JavaScript基础&实战(1)js的基本语法、标识符、数据类型
|
20天前
|
开发者 图形学 开发工具
Unity编辑器神级扩展攻略:从批量操作到定制Inspector界面,手把手教你编写高效开发工具,解锁编辑器隐藏潜能
【8月更文挑战第31天】Unity是一款强大的游戏开发引擎,支持多平台发布与高度可定制的编辑器环境。通过自定义编辑器工具,开发者能显著提升工作效率。本文介绍如何使用C#脚本扩展Unity编辑器功能,包括批量调整游戏对象位置、创建自定义Inspector界面及项目统计窗口等实用工具,并提供具体示例代码。理解并应用这些技巧,可大幅优化开发流程,提高生产力。
70 1
|
29天前
|
JavaScript 前端开发
JS常用数据类型转换(数字型和字符串型之间转换)
JS常用数据类型转换(数字型和字符串型之间转换)
34 2
|
29天前
|
前端开发 JavaScript
Web 前端大揭秘!JS 数据类型检测竟如此震撼,一场惊心动魄的代码探秘之旅等你来!
【8月更文挑战第23天】在Web前端开发中,合理检测数据类型至关重要。JavaScript作为动态类型语言,变量类型可在运行时变化,因此掌握检测技巧十分必要。
22 1
|
29天前
|
存储 前端开发 JavaScript
Web前端的奇幻之旅:探索JS数据类型的奥秘与差异
【8月更文挑战第23天】JavaScript是一种动态类型语言,提供多种内置数据类型支持信息的存储与操作。这些类型对Web前端开发者至关重要,直接影响代码性能与可读性。JavaScript数据类型主要分为两大类:原始数据类型(如Undefined、Null、Boolean等)与引用数据类型(如Object、Array等)。原始类型直接存储值,而引用类型存储指向数据的引用。原始类型不可变且存储在栈中,访问更快;引用类型则存储在堆中,可通过其引用进行修改。理解这些差异有助于编写高效、可维护的代码。
29 0
|
1月前
|
JavaScript
js基础数据类型
js基础数据类型
|
20天前
|
存储 JavaScript 前端开发