• 【第四部分 | JavaScript 基础】1：JS概述、变量及输入输出

    目录

    | 概述

    | JS的书写位置

    | 输入输出

    | 变量

    命名规范

    基本使用

    通过输入语句prompt把信息赋值给变量

    | 数据类型

    JS数据类型的特别

    简单数据类型 简介

    简单数据类型 Number

    简单数据类型 String

    简单数据类型 Boolean、Undefined、Null

    获取类型

    类型转换

    | 概述

    JavaScript 虽然有 「Java」，但是它和 Java 是完全不同的两门语言，甚至类型都不一样（JS是脚本语言，Java是编译型语言）

    但是它们在语法上是有大部分相近的地方的。毕竟这是一个给后端开发的同学编写的入门前端的不那么专业的可能漏洞百出的笔记，所以默认大家都会 Java了。

    如果不会 Java，可以来这里了解一下下：

    https://blog.csdn.net/m0_57265007/category_12003054.htmlicon-default.png?t=M85Bhttps://blog.csdn.net/m0_57265007/category_12003054.html

    当然，不会Java也没关系，本文章大部分的基础都介绍到了。但是并不是零基础向的，更适合于有一定编程基础的同学学习。

    下面，就让我们开始吧 ……

    JS的作用

     

    运行原理

    JavaScript的组成 （第四部分，也就是这部分，学习的是 JS语法。后面第五部分学习JS的WebAPI）

     

    | JS的书写位置

     

     

    代码示例

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7.     <title>Documenttitle>
    8.     
    9.     <script>
    10.         alert('Hello JavaScript!')
    11.     script>
    12.     
    13.     <script src="js/1.外部js.js">script>
    14. head>
    15. <body>
    16.     
    17.     <input type="button" name="button" value="Click" onclick="alert('Hello JavaScript!')"/>
    18. body>
    19. html>

    | 输入输出

     代码示例

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7.     <title>Documenttitle>
    8.     <script>
    9.         alert('请输入信息');
    10.         prompt('请输入您的岁数：');
    11.         console.log('控制台语句');
    12.     script>
    13. head>
    14. <body>
    15. body>
    16. html>

     

    | 变量

    命名规范

    基本使用

    声明

     赋值

    初始化

     

    代码示例

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7.     <title>Documenttitle>
    8.     <script>
    9.         var num = 10;
    10.         alert('num的数值是：'+num);
    11.     script>
    12. head>
    13. <body>
    14.     
    15. body>
    16. html>

     

    通过输入语句prompt把信息赋值给变量

    代码示例

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7.     <title>Documenttitle>
    8.     <script>
    9.         // var num = 10;
    10.         // alert('num的数值是：'+num);
    11.  
    12.         var name = prompt('请输入您的名字：');
    13.         alert('您好，'+name);
    14.     script>
    15. head>
    16. <body>
    17.     
    18. body>
    19. html>

     特殊情况示例

     

    | 数据类型

     

    JS数据类型的特别

    • 变量是用来存储值的所在处，它们有名字和数据类型。变量的数据类型决定了如何将代表这些值的位存储到计算机的 内存中。JavaScript 是一种弱类型者说动态语言。这意味着不用提前声明变量的类型，在程序运行过程中，类型会 被自动确定。

    • JavaScript 拥有动态类型，同时也意味着相同的变量可用作不同的类型：

    • JavaScript的数据类型：简单数据类型 （Number,String,Boolean,Undefined,Null）；

      复杂数据类型（Object）

    简单数据类型 简介

     

     

    简单数据类型 Number

    • JavaScript 数字类型既可以用来保存整数值，也可以保存小数(浮点数）。

    • 如何表示进制？在JS中八进制前面加0，十六进制前面加 0x

    • JS数字的最大值：Number.MAX_VALUE，这个值为： 1.7976931348623157e+308；最小值：Number.MIN_VALUE，这个值为：5e-32

    • 三个特殊值： Infinity（无穷大）、-Infinity（无穷小）、NaN（非数值）

    • 函数判断Number是都为非数值NaN isNaN(x)

     

     

     

    简单数据类型 String

    • 使用单引号或者双引号括起来。因为 HTML 标签里面的属性使用的是双引号，JS 这里我们更推荐使用单引号作为最外面一层的括号。

    • JS 可以用单引号嵌套双引号 ，或者用双引号嵌套单引号

    转义符：

    • 获取字符串长度：XXX.length 如：var strLength = str.length;

    • 字符串拼接：字符串 + 任何类型 = 拼接之后的新字符串 若“任何类型”为其它数据类型，则不需要加引号

     

    简单数据类型 Boolean、Undefined、Null

    • Boolean：可以是0/1 false/true

    代码示例

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7.     <title>Documenttitle>
    8.     <script>
    9.         var boolNum = true;
    10.         alert('Boolean true + 1 = ' + (boolNum+1));
    11.  
    12.         var num;
    13.         alert('num = ' + num);
    14.  
    15.         var num2 = null;
    16.         alert('num2 = ' + num2);
    17.     script>
    18. head>
    19. <body>
    20.     
    21. body>
    22. html>

     

     

    • Undefined：简单数据类型声明后没有赋值，则默认是Undefined

    • Null：一般是对象没有复制 默认为Null

     

    获取类型

    • 使用 typeof 变量名 进行数据类型的获取

     

    类型转换

    转为字符串

     转为数字

     

    转为Boolean

     

  • 相关阅读:
    王道考研--》顺序表课后习题C语言代码实现（冲刺）
    AR眼镜方案—单目光波导AR智能眼镜
    springboot版HelloWorld
    C/C++ 取整函数ceil(),floor(),Nullif 函数
    「基础知识」带你深度剖析路由器和交换机！
    el-table自适应列宽实现
    生产中遇到的Spring项目Bean的多次加载问题
    黑豹程序员-架构师学习路线图-百科：开启分布式架构开发先河，让Java戴上全球第一的皇冠-EJB
    从功能测试到自动化测试，待遇翻倍的秘籍在这里~
    CISC和RISC的比较
  • 原文地址：https://blog.csdn.net/m0_57265007/article/details/127961814