JavaScript 基本数据类型

206 阅读4分钟

String类型

字符串是存储字符(比如 “Keafmd”)的变量。
字符串可以是引号中的任意文本。可以使用单引号或双引号。

<script type="text/javascript">
    var name = '牛哄哄的柯南';
</script>

字符串属性和方法

原始值字符串,如 “John”, 没有属性和方法 (因为他们不是对象)。
原始值可以使用 JavaScript 的属性和方法,因为 JavaScript 在执行方法和属性时可以把原始值当作对象。

字符串属性

属性说明
constructor返回创建字符串属性的函数
length返回字符串的长度
prototype允许您向对象添加属性和方法

字符串方法

方法描述
charAt()返回指定索引位置的字符
charCodeAt()返回指定索引位置字符的 Unicode 值
concat()连接两个或多个字符串,返回连接后的字符串, 产生新字符串
fromCharCode()将 Unicode 转换为字符串
indexOf()返回字符串中检索指定字符第一次出现的位置
lastIndexOf()返回字符串中检索指定字符最后一次出现的位置
localeCompare()用本地特定的顺序来比较两个字符串
match()找到一个或多个正则表达式的匹配
replace()替换与正则表达式匹配的子串
search()检索与正则表达式相匹配的值
slice()提取字符串的片断,并在新的字符串中返回被提取的部分
split()把字符串分割为子字符串数组
substr()从起始索引号提取字符串中指定数目的字符
substring()提取字符串中两个指定的索引号之间的字符
toLocaleLowerCase()根据主机的语言环境把字符串转换为小写
toLocaleUpperCase()根据主机的语言环境把字符串转换为大写
toLowerCase()把字符串转换为小写
toString()返回字符串对象值
toUpperCase()把字符串转换为大写
trim()移除字符串首尾空白
valueOf()返回某个字符串对象的原始值

样例代码:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script>
            
            var msg = 'hello javascript';
            
            

            
            console.log('字符串最后一个 字符:'+msg.charAt(msg.length-1))

            
            var str1  = "hello ";
            var str2 = "world!"
            console.log("str1.concat(str2):"+str1.concat(str2))
            console.log("str1: "+str1);
            console.log("str2: "+str2);

            
            var str3 = "hello world!"
            console.log("str3.indexOf('l'): "+str3.indexOf('l'))
            console.log("str3.lastIndexOf('l'): "+str3.lastIndexOf('l'))



            
            
            var str4 ="Hello My Name is Keafmd,Age is 18" 

            console.log('str4.slice(6): '+str4.slice(6))
            console.log('str4.slice(17): '+str4.slice(17,23))
            console.log('str4.slice(-2,str4.length): '+str4.slice(-2,str4.length))

            
            console.log("str4.substr(17,6): "+str4.substr(17,6))
            console.log("str4.substring(17,6): "+str4.substring(17,23))

            
            console.log("str4.toUpperCase(): "+(str4.toUpperCase()))
            console.log("str4.toLowerCase(): "+(str4.toLowerCase()))
            console.log("str4: "+str4);

            
            var str5 ="  Hello  " 
            console.log("str5.length: "+str5.length);
            console.log("str5.trim().length: "+str5.trim().length);

        </script>
    </head>
    <body>
    </body>
</html>

效果截图:

JavaScript 只有一种数字类型。数字可以带小数点,也可以不带。

样例代码:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script type="text/javascript">
		    var age = 18;
			var number = 34.7
		    
		    console.log('age:'+age)
		    console.log('number:'+number)
		</script>
		<title></title>
	</head>
	<body>
	</body>
</html>


效果截图:

算术运算符

运算符描述例子x 运算结果y 运算结果
+加法x=y+275
-减法x=y-235
*乘法x=y*2105
/除法x=y/22.55
%取模(余数)x=y%215
++自增x=++y66
++自增x=y++56
自减x=- -y44
自减x=y- -54

1. 自增 (++) 和自减(- -):放到变量的前面有限参与运算,然后再跟表达式计算。
2. 如果 + 参与运算的类型是字符串, 则会将结果以字符串的形式返回。
3. 数值类型和 bool 类型运算时,bool 类型会转换成数字, true:1 false:0。

样例代码:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script>
            
            var numa = 5;
            var numb = 6;
            var numc = 10;

            console.log("numa+numb: "+(numa+numb));
            console.log("numa-numb: "+(numa-numb));
            console.log("numa*numb: "+(numa*numb));
            console.log("numa/numb: "+(numa/numb));
            console.log("numc%numb: "+(numc%numb));

            

            var numd = 2;
            
            


            console.log(++numd);
            console.log(numd);
            
            console.log('1'+'1')
            
            console.log("true+1 : "+(true+1));
            console.log("false+1 : "+(false+1));

        </script>
    </head>
    <body>
    </body>
</html>

效果截图:

赋值运算符

赋值运算符用于给 JavaScript 变量赋值。
给定 x=10 和 y=5,下面的表格解释了赋值运算符:↓

运算符例子等同于运算结果
=x=yx=5
+=x+=yx=x+yx=15
-=x-=yx=x-yx=5
*=x*=yx=x*yx=50
/=x/=yx=x/yx=2
%=x%=yx=x%yx=0

样例代码:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script>

            

            var numa = 100;
            var numb = numa;

            console.log("numa: "+numa); 
            console.log("numb: "+numb); 


            numa += 10; 
            console.log("numa: "+numa); 

            numa -= 10; 
            console.log("numa: "+numa); 

            numa *= 2; 
            console.log("numa: "+numa); 

            numa /= 5; 
            console.log("numa: "+numa); 

            numa %= 38; 
            console.log("numa: "+numa); 

        </script>
    </head>
    <body>
    </body>
</html>

效果截图:

比较运算符

比较运算符在逻辑语句中使用,以测定变量或值是否相等。
给定 x=5,下面的表格解释了比较运算符:↓

运算符描述比较返回值
==等于x==8false
==等于x==5true
===绝对等于(值和类型均相等)x===“5”false
===绝对等于(值和类型均相等)x===5true
!=不等于x!=8true
!==不绝对等于(值和类型有一个不相等,或两个都不相等)x!==“5”true
!==不绝对等于(值和类型有一个不相等,或两个都不相等)x!==5false
>大于x>8false
<小于x<8true
>=大于或等于x>=8false
<=小于或等于x<=8true

样例代码:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script>
            var numa = 100;
            var numb = 150;
            var numc = 100;

            console.log("100 == 150: "+(numa == numb));
            console.log("100 != 150: "+(numa != numb));
            console.log("100 >  150: "+(numa > numb));
            console.log("100 <  150: "+(numa < numb));


            console.log("100 >=  150: "+(numa >= numb));
            console.log("100 <  150: "+(numa <= numb));

            


            var v1 = 100;
            var v2 = '100';
            var v3 = 100;

            
            console.log("v1 == v2: " +(v1 == v2));
            console.log("v1 === v2: " +(v1 === v2));
            console.log("v1 === v3: " +(v1 === v3));


        </script>


    </head>
    <body>

    </body>
</html>

效果截图:

逻辑运算符

逻辑运算符用于测定变量或值之间的逻辑。
给定 x=6 以及 y=3,下表解释了逻辑运算符:↓

运算符描述例子
&&and(x < 10 && y> 1) 为 true
||or(x==5 || y==5) 为 false
!not!(x==y) 为 true

样例代码:

<!DOCTYPE html>
<htm<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script>
            
            
            
            


            
            console.log( "true && true : "+(true && true)); 
            console.log( "true && false : "+(true && false)) ;
            console.log( "false && false : "+(false && false)); 

            
            console.log( "true || true : "+(true ||  true)) ;
            console.log( "true || false : "+(true ||  false)) ;
            console.log( "false || false : "+(false ||  false)) ;

            
            console.log( "!true : "+(!true))
            console.log( "!false : "+(!false))


            
            var  age = 70;
            
            var info =  age>=18  ?  '成年'  : '未成年';

            console.log(info)

        </script>
    </head>
    <body>
    </body>
</html>

效果截图:

该类型只有两个值,true 和 false
表示真或者假. 常用于判断。

true :取值 true 、非 0 的数字、非空字符串 (字符长度为 0)
false:取值 false、0、 空字符串、null、undefined

只有一个值,即 undefined 值。使用 var 声明了变量,但未给变量初始化值,那么这个变量的值就是 undefined。

Null 类型被看做空对象指针,Null 类型也是空的对象引用。

typeof 运算符,返回的是变量的类型名字(字符串)

样例代码:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script>
			var t1 = 'Keafmd';
			var t2 = 3.14;
			var t3 = false;
			var t4 = null;
			var t5 = undefined;
			
			var t6 = [];
			var t7 = {};
			var t8 = function(){};
			
			console.log("typeof(字符串): "+typeof(t1))
			console.log("typeof(数字): "+typeof(t2))
			console.log("typeof(null): "+typeof(null))
			console.log("typeof(undefined): "+typeof(undefined))
			console.log("typeof([]): "+typeof(t6))
			console.log("typeof({}): "+typeof(t7))
			console.log("typeof(function): "+typeof(t8))
			
			if(typeof(t1) === 'string'){
			    console.log('是字符串')
			}
		</script>
		<title></title>
	</head>
	<body>
	</body>
</html>


效果截图:

写作不易,读完如果对你有帮助,感谢点赞支持!
如果你是电脑端,看见右下角的 “一键三连” 了吗,没错点它 [哈哈]

加油!

共同努力!

Keafmd