JavaScript的变量基础精选超详细的学习分享!

本篇讲的是JavaScript的变量基础,先讲一下变量的基础概念和标量的数据类型,希望对大家有所帮助,一起加油!

  1. 变量

1.1 变量的概念:

变量是指程序中一个已经命名的储存单位,它的主要作用就是为数据操作提供存放信息的容器。变量可以看作是一个容纳数据的容器。

1.2 变量的声明与赋值

在JavaScript中,使用变量前需要先对其进行声明,声明变量是使用系统关键字var来进行的。在声明变量时也可以使用赋值号“=”对变量进行赋值,语法格式如下:

var 变量名 = 变量值

举例:

var  name ;  //声明一个变量
var name,city,like ; //声明多个变量,多个变量之间用英文状态下的逗号分开
var name = 阿泽; //声明一个变量并且赋值

1.3 变量的命名规则

  • 变量不能以数字开头,可以以字母或下划线开头。

  • JavaScript的变量名要区分大小写。

  • 不能使用JavaScript中的关键字作为变量名。

2.变量的数据类型

变量的类型关键在于值的类型

2.1数值型

数值型的变量是可以进行数学运算的,它包括:整型、浮点型和NaN

例:

var a = 10;
var y = 0.1;
var x = 100;

其中较为特殊的是:NaN(not a number)不是一个数字。当将其它数据类型,转成数值型,转不过去,但程序又不能报错,这时将返回一个NaN的值。如下情况:

<html>
      <head>
        <Meta http-equiv=Content-Type content=text/html; charset=utf-8>
        <title>PHP.cn</title>
        <script>
           var length = 500m;
           length = length*5;
           document.write(length);
        </script>
    </head>
    <body>
    </body>
</html>

现在我们想让一个东西的长度变成原来的5倍,一个字符串,是不能转换成有意义的数值的,只能转换成NaN
一个含纯数字的字符串,可以转成有意义的数值,可以修改length为纯数字的字符串,输出查看结果。

2.2字符型

单引号或者双引号引起来的一个字符串。

需要注意的是:单引号和双引号之间可以相互嵌套;单引号内只能嵌套双引号,双引号内只能嵌套单引号。

<!DOCTYPE html>
<html lang=en>
<head>
    <Meta charset=UTF-8>
    <Meta name=viewport content=width=device-width, initial-scale=1.0>
    <Meta http-equiv=X-UA-Compatible content=ie=edge>
    <title>Document</title>
    <script>
    var name = 阿泽;
            var str = 我的名字是' +name+'
            document.write(str)
    </script>
   </head>
<body>
    </body>
</html>

其中加号是字符串连接符,如果想在双引号内,再嵌套双引号,里面的双引号,一定要进行转义(\”)。JS中的转义字符是反斜杠(\)

常用的转义字符有:\’\”\\\r\n等。

<!DOCTYPE html>
<html lang=en>
<head>
    <Meta charset=UTF-8>
    <Meta name=viewport content=width=device-width, initial-scale=1.0>
    <Meta http-equiv=X-UA-Compatible content=ie=edge>
    <title>Document</title>
    <script>
    var name = 阿泽;
            var str =  我的名字叫做\ +name+\
            document.write(str)
    </script>
   </head>
<body>
    </body>
</html

2.3 布尔型

布尔型又称逻辑型。只有两个值:true(真)、false(假)。也就是两个状态,比如:灯的开关、性别等。

var a = true;
var b = false

布尔型常用if条件判断语句中,例:

<!DOCTYPE html>
<html lang=en>
<head>
    <Meta charset=UTF-8>
    <Meta name=viewport content=width=device-width, initial-scale=1.0>
    <Meta http-equiv=X-UA-Compatible content=ie=edge>
    <title>Document</title>
    <script>
     var a = 10;
           var b = 110;
           if(x>y){
               document.write(a+比+b+大);
           }else{
               document.write(b+比+a+大);
           }
    </script>
   </head>
<body>
    </body>
</html>

2.4 未定义型

未定义型的值只有一个undefined

一个变量定义,未被赋值时,会返回为未定义型;一个对象,属性不存在时,也会返回为未定义型;

例:未赋值

<!DOCTYPE html>
<html lang=en>
<head>
    <Meta charset=UTF-8>
    <Meta name=viewport content=width=device-width, initial-scale=1.0>
    <Meta http-equiv=X-UA-Compatible content=ie=edge>
    <title>Document</title>
    <script>
      var x;
           document.write(x);
    </script>
   </head>
<body>
    </body>
</html>

2.5 空型

空型只有一个值:null

一个对象不存在时,将返回空型;如果你想清除一个变量的值的话,可以给赋一个null的值。

<!DOCTYPE html>
<html lang=en>
<head>
    <Meta charset=UTF-8>
    <Meta name=viewport content=width=device-width, initial-scale=1.0>
    <Meta http-equiv=X-UA-Compatible content=ie=edge>
    <title>Document</title>
    <script>
      var x = null;
     var a = 100;
     var a = null ;
     document.write(x);
     document.write(a);
    </script>
   </head>
<body>
    </body>
</html>

【推荐学习:javascript高级教程

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...