数据类型-字符串

2019-06-18  本文已影响0人  潘肚饿兵哥哥

\color{rgba(254, 67, 101, .8)}{数据类型简介}

不同的数据占用的存储空间不同,数据类型是为了把数据分成所需内存大小不同的数据,编程的时候需要用大数据的时候才需要申请大内存,就可以充分利用内存

JS是弱类型语言,不需要提前声明数据类型
JS的变量数据类型是只有在程序在运行的过程中,根据等号右边的值来确定的

JS是动态语言,相同的变量可以用作不同的类型

\color{rgba(254, 67, 101, .8)}{简单数据类型}

  • 简单数据类型:(number string boolean undefined null)
  • 复杂数据类型 object
\color{rgba(3, 101, 100, .8)}{简单数据类型} \color{rgba(3, 101, 100, .8)}{说明}
Number 数字型,包含整型和浮点型
Boolean 布尔类型,true和false,等价于1和0
String 字符串类型,JS中字符串都要带引号
Undefined var a;声明了变量,但是没有赋值,此时a = undefined
Null var a = null;声明了变量a为空值

\color{rgba(3, 101, 100, .8)}{数字型}

JS最大值和最小值
ALERT(Number.MAX_VALUE);
1.7976931348623157e+308

ALERT(Number.MIN_VALUE);
5e-324

alert(Infinity); 无穷大
alert(-Infinity); 无穷小

最大值*2就是infinity

NaN,Not a number 代表一个非数值
console.log('hello' - 100); 返回值NaN,因为字符串和数字没法做运算

用 ; 这个方法判断非数字,是数字返回false,非数字返回true

console.log(isNaN(123));

返回值: false

\color{rgba(3, 101, 100, .8)}{字符串型String}

双引号和单引号中的文本都是字符串型
一般推荐使用单引号,因为有单双引号嵌套的问题,所以引号使用的一般原则是外双内单,因此一般用单引号

在使用字符串的过程中,有时会需要换行 空格等,需要用转义符

\color{rgba(3, 101, 100, .8)}{转义符} \color{rgba(3, 101, 100, .8)}{说明}
\n 换行,n是newline的意思
\\ 斜杠
\' 单引号
\" 双引号
\t tab 缩进
\b 空格 b是blank的意思

这些符号要写在引号中才有用

<script>
        var str = '这是一个\n字符串';
        console.log(str);
</script>
image.png

\color{rgba(254, 67, 101, .8)}{字符串长度及拼接}

用length属性检查字符串的长度(如果中间包含空格,那么一个空格也会被算作一个长度)

\color{rgba(53, 93, 129, .8)}{字符串长度}

    <script>
        //字符串长度
        var a = 'this is my pencil';
        console.log(a.length);
    </script>
image.png

\color{rgba(53, 93, 129, .8)}{字符串拼接}

  • 字符串 + 任何类型 = 拼接后的新字符串
  • 字符串拼接时,会自动把其他类型转换成字符串后拼接
    <script>
        var b = '长度' + 10;
        console.log(b);
    </script>

或者这样写

<script>
        console.log('长度' + 10);
<script>
image.png

\color{rgba(254, 67, 101, .8)}{一个小案例}

接收一个用户输入数据,并且进行字符串拼接之后用弹窗显示

下面两种写法都能出结果

    <script>
        //一个案例,接收用户输入信息,进行字符串拼接之后在弹窗中输出
        var a = prompt('请输入年龄');
        alert('你今年' + a + '岁了');
    </script>
或者这样写也是一样的结果:
    <script>
        alert('你今年' + prompt('请输入年龄') + '岁了');
    </script>
image.png image.png

\color{rgba(254, 67, 101, .8)}{boolean-undefined-null}

    <script>
        //布尔型
        var flag = true; 
        //布尔型
        var flag1 = false;  
    </script>

上面两个变量就是布尔型,还有一个问题是,布尔型在运算时,true是1,false是0;
此时,如果用flag + 1,结果就是2

    <script>
        var flag = true; 
        var flag1 = false;  
        console.log(flag + 1);
    </script>
image.png

\color{rgba(254, 67, 101, .8)}{未定义的变量(undefined)和字符串相加还是字符串}
\color{rgba(254, 67, 101, .8)}{但是如果是和数字相加就是NaN}

    <script>
        var a = undefined;
        console.log(a + 'hello');
        console.log(a + 1);
    </script>
image.png

\color{rgba(254, 67, 101, .8)}{null(空值)和字符串相加与undefined一样,还是字符串的拼接}
\color{rgba(254, 67, 101, .8)}{null和数字相加就是那个数字}

    <script>
        //null和字符串、数字相加
        var a = null;
        console.log(a + 'hello');
        console.log(a + 1);
    </script>
image.png

\color{rgba(254, 67, 101, .8)}{获取变量数据类型}
\color{rgba(254, 67, 101, .8)}{用typeof来检测数据类型}

    <script>
        var a = 10;
        console.log(typeof a);
        var b = 'hello';
        console.log(typeof b);
        var c = true;
        console.log(typeof c);
        var d = undefined;
        console.log(typeof d);
        var e = null;
        console.log(typeof e);
    </script>

用typeof可以查看数据类型,至于最后一个null的数据类型是object,因为null这个值专门用来表示一个为空的对象

image.png

\color{rgba(254, 67, 101, .8)}{前面用prompt获取到的年龄其实不是数字类型,是字符串类型:}
\color{rgba(254, 67, 101, .8)}{在这个例子中,如果不用typeof查看的话,是看不出它是字符串类型的}

    <script>
        var a = prompt('请输入年龄');
        console.log(a);
        console.log(typeof a);
    </script>
image.png

\color{rgba(254, 67, 101, .8)}{prompt方法返回的是字符串}

prompt(msg,defaultText)第一个参数是在弹窗中显示的提示信息,第二个参数是在输入框中显示的默认字符

    <script>
        var a = prompt('请输入年龄','岁');
        console.log(a);
        console.log(typeof a);
    </script>

image.png

\color{rgba(254, 67, 101, .8)}{字面量}


上一篇 下一篇

猜你喜欢

热点阅读