前言:

我不是搞前端,而是搞后端的。本命编程语言是java。学习js的嘛,因为看到室友能做出动态网页,而我只能做出静态网页,再加上下个学期要学所以提前来学习学习。

温馨提示:

java和javsScript没有半毛钱关系,只是javaScript被SUN公司收购后,把改成jaaScript,第一是因为SUN的主打产品是java,第二是利用java的知名度去javaScript做广告,扩大javaScript的影响力。

接下来就分享今日的干货

变量

什么是变量?

我们需要用编程语言去处理现实生活中的各种数据,而各种数据又是存储在哪里的呢?答案就是变量,变量不是什么高大尚的东西,它就是一个装东西的盒子把它说塑料袋也不为过。变量的本质就是在内存中开辟一块存放数据的空间。类似的我们酒店的房间,一个房间就可以看做一个变量。

变量的使用

变量使用时分为两个步骤,1.声明变量,2.赋值。我们还是用同样的思想去理解这两个步骤,有一天我来一家酒店,我向老板说要开一间单人房,当我付钱后,老板给我房卡,这就意味着我在某一个期限内,可以入住那个房间。(我付钱,老板给卡,相当于声明),我入住之后,空房间有人了相当于赋值。

接下来看看JS中的变量的使用

1.声明

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

  • var 是js的一个关键字,用来声明变量(variable变量的意思),使用该关键字声明变量后,计算机自动为变量分配内存空间
  • age程序员定义的变量名,我们要通过变量名来访问内存中分配的空间

2.赋值

var age=19; //给age这个变量赋值为19
  • =用来把右边的值给左边的变量空间,这就是赋值
  • 变量值是程序员保存到空间变量里的值

3.二个语法小细节

更新变量:一个变量被重新赋值后,它原来的值就会被覆盖,变量值以最后一次赋的值为准

var age=18;
age=19;//最后的结果为19.因为18被19覆盖了

同时声明多个变量:只需写一个var ,然后变量名之间用英文逗号隔开

var age,number,average;

声明变量的特殊情况

特殊一

		var sex;只声明,不赋值,程序也不知道是啥,所以结果是 undefined (未定义的)
		console.log(sex);

特殊二

	console.log(sex); 不赋值,不声明,直接使用某个变量会报错

特殊三

qq=90;
console.log(qq); 不声明直接赋值直接用,不会报错!!!
这就很离谱,但是在javaScript就是对的,因为它太自由了。

变量的命名规范

  • 有字母(AZ,az),下划线_,美元符号$组成,如userName
  • 严格区分大小写。var app;和var App;是两个变量
  • 不能以数字开头,如12age则是错误的
  • 不能是关键字,保留字,例如:var ,for ,while.
  • 变量名必须有意义,要做到见名知意
  • 遵循驼峰命名法:首字母大写,后面的单词首字母需要大写。如:myName
  • 推荐翻译网站:有道,或者直接百度

为什么需要数据类型?

编程语言是用来处理现实生活中的问题,我们在现实世界中要处理各种各样的数据,其中就有整数,小数,文字等等,对应的在编程语言也有整数,浮点数,字符。在计算机中不同类型的数据所占的储存空间也是不一样的,为了方便把数据分为所需内存大小不同的数据,充分的利用储存空间,于是就定义了不同的数据类型。简单的来说,数据类型就是数据的类别型号,就是对数据分类。如姓名,“叶秋涵”,年龄18,这些数据的类型的就是不一样的。

变量的数据类型

变量是用来储存值的所在处,它们都有其名字和类型,变量的数据类型决定了如何将代表这些值的位储存到计算机的内存中,javaScript是一种弱类型或者说动态语言,这意味着不用提前声明变量的

类型,程序在执行过程中会自动。

var age=10;          //这是一个数字型
var name='叶秋涵';      //这是一个字符串

在代码的运行过程中,变量的数据类型是由js引擎根据=右边变量值的数据类型来判断的,运行完毕之后,变量就确定了数据类型

js拥有动态类型,同时意味着相同的变量可以作不同的类型

var x=6;      //x为数字
var x='哔哩哔哩';  //x为字符串

简单数据类型(基本数据类型)

js中的简单数据类型及其说明

简单数据类型 说明 默认值
Number 数字型,包括整数值和浮点数值,如12,0.2022 0
Boolean 布尔值是类型,如true,false,等价于1和0 false
String 字符串类型,如"叶秋涵",注意在js中字符串都带引号 “”
Undefined var a; 声明变量a但是没有给值,此时a=undefined undefined
Null var a=null; 声明a变量为空值 null

数字型

1.数字型进制

最常见的进制有二进制,八进制,十进制,十六进制

//1.八进制数字序列范围0~7
var num1=07; //对应十进制的7
var num2=019; //对应十进制的19
var num3=08  //对应十进制的8
//2.十六进制数字序列范围:0~9以及A~F
var num=0xA;

现在我们只要记住,在js中八进制前面加0,十六进制前面加0x

2.数字型范围

js中数值的最大值和最小值

	alert(Number.MAX_SAFE_INTEGER);//9007199254740991
	alert(Number.MIN_VALUE);//5e-324

3.数字型三个特殊值

	alert(Infinity);//Infinity
	alert(-Infinity);//-Infinity
	alert(NaN);//NaN
  • Infinity,代表无穷大,大于任何值
  • -infinity,代表无穷小,小于任何值
  • NaN, Not a number,代表一个非数值

字符串型 String

字符串型可以是引号中的任意文本,其语法是单引号**’'和双引号""**

			var srtAge = '18';
			var strName = '叶秋涵';
			var srtFood = '我爱垃圾食品';
			//常见错误
			var srtNum2 = 11; //报错,没有引号,会被认为是js代码,但是js没有这些语法

因为在HTML标签中里面的属性使用的是双引号,js这里我们更推荐使用单引号

字符串引号嵌套

js可以用单引号嵌套双引号,或者用双引号嵌套单引号(外双内单,内单外双)

var strMsy = '我是"程序员"萧寒';
			console.log(strMsy)
			var strMsy2 = "我是'程序员'萧寒";
			console.log(strMsy2);
			//常见错误
			var badQuotes = "What on earth?"';
			console.log(strMsy2);

结果如下

在这里插入图片描述

在这里插入图片描述

字符串转义符

类似HTML里面的特殊字符,字符串中也有特殊字符,我们称为转义符

转义符都是由\开头,常用的转义字符及其说明如下

转义符 解释说明
\n 换行符,n是newline的意思
\ \ 斜杠\
\ ’ 单引号
\ * 双引号
\t tab缩进
\b 空格 ,b是blank的意思

布尔型Boolean

布尔类型有两个值,true和false,其中true表示真,而false表示假

布尔型和数字型相加的时候,true的值为1,false的值为0

		console.log(true 1);//2
		console.log(false 0);//0

Undefined和Null

一个声明后没有被赋值的变量会默认有一个默认值undefined(如果进行相加或者相连时,注意结果)

var variable;
			console.log(variable);
			console.log('你好' variable);
			console.log(11 variable);// 起连接作用
			console.log(true variable); 

结果如下

在这里插入图片描述

​一个变量给null值,里面储存的值为空,就是啥也没有

	var vari=null;
			console.log('你好' vari);
			console.log(11 vari);
			console.log(true vari);

结果如下

在这里插入图片描述

什么是数据类型的转换

使用表单,prompt获取过来的数据默认值是字符串类型,此时就不能进行简单的加法运算,而是需要转换变量的数据类型,简单来说,就是把一种数据类型转换成另一种数据类型。

三种常用的转换方式

  • 转换为字符类型
  • 转换为数字型
  • 转换为布尔型

1.转换为字符串

方式 说明 案例
toString() 转换为字符串 var num=1; alert(num.toString());
String()强制转换 转换为字符串 var num=1; alert(String(num));
加号拼接字符串 和字符串拼接的结果是字符串 var num=1; alert(num “我是字符串”);
  • toString()和String()使用放方式一样
  • 三种转换方式,前面两种了解,第三种转换为常用,也成为隐形转换

2.转换为数字型(重点)

(一)利用js提供的函数

js提供了parseInt()和parseFloat()两个转换函数。前者把值转换成整数,后者把值转换成浮点数。

看看代码就明白了

		var age=12;
		console.log(age);
		//利用parseInt()将值转换为整数
		console.log(parseInt(age));
		console.log(parseInt('3.12'));//取整
		console.log(parseInt('3.89'));//取整
		console.log(parseInt('10px'));
		console.log(parseInt('rem120px'))//NaN
		//利用parseFloat()将值转换为整数
		console.log(parseFloat('3.14'));//3.14
		console.log(parseFloat('120px'));//120会去掉px这个单位
		console.log(parseFloat('rem102px'));//NaN js引擎读到rem的时候,无法识别,直接判为空

(二)强制转换 Number()转换函数

		var str='123';
		console.log(Number(str));//123
		console.log(Number('12'));//12

(三)js的隐形转换(- * /) 注意没有 , 起拼接作用

		console.log('12'-0);//12
		console.log('122' 1);//1221
		console.log('123'*123);//15129
		console.log('123'/123);//1

转化为布尔型

方式 说明 案例
Boolean()函数 其它类型转换为布尔值 Boolean(‘true’)
  • 代表空,否定的值会被转换为false,如’’,0,NaN,null,undefined
  • 其余值都会转换为true
		console.log('');//false
		console.log(0);//false
		console.log(NaN);//false
		console.log(null);//false
		console.log(undefined);//false
		console.log('小白');//true
		console.log(12);//true

总结

本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注Devmax的更多内容!

一篇文章带你搞懂JavaScript的变量与数据类型的更多相关文章

  1. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  2. HTML5数字输入仅接受整数的实现代码

    这篇文章主要介绍了HTML5数字输入仅接受整数的实现代码,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  3. amaze ui 的使用详细教程

    这篇文章主要介绍了amaze ui 的使用详细教程,本文通过多种方法给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  4. html5简介_动力节点Java学院整理

    这篇文章主要介绍了html5简介,用于指定构建网页的元素,这些元素中的大多数都用于描述网页内容,有兴趣的可以了解一下

  5. ios – 如何从变量访问属性或方法?

    是否可以使用变量作为Swift中方法或属性的名称来访问方法或属性?在PHP中,您可以使用$object->{$variable}.例如编辑:这是我正在使用的实际代码:解决方法你可以做到,但不能使用“纯粹的”Swift.Swift的重点是防止这种危险的动态属性访问.你必须使用Cocoa的Key-ValueCoding功能:非常方便,它完全穿过你要穿过的字符串到属性名称的桥,但要注意:这里是龙.

  6. iOS &gt;&gt;块&gt;&gt;更改块外部的变量值

    我不是在处理一个Object并改变它,就像我的mString一样.我希望’center’属性的行为类似于myInt,因为它是直接访问的C结构,而不是指向对象的指针.我希望’backgroundColor’的行为类似于我的imstring,因为它是一个指向一个新对象的对象的指针,不是吗?

  7. ios – Xcode Bot:如何在post触发器脚本上获得.ipa路径?

    我正在使用机器人来存档iOS应用程序,我需要获取.ipa产品路径才能将其发布到我们的分发系统中.机器人设置:并使用脚本打印所有env变量,其中不包含ipa文件的路径.此外,一些变量指向不存在的目录,即:XCS_OUTPUT_DIR这里的env变量输出:除此之外,我还能够确认.ipa文件是在另一个文件夹中创建的(/IntegrationAssets//

  8. ios – 使用附加字符串本地化Info.plist变量

    我正在尝试本地化应用程序的名称,同时仍然能够根据构建配置追加字符串.所以目前它被设置为:该设置定义为:通过这种方式,我们可以为应用程序添加后缀以用于不同的beta版本.问题是,当我们尝试本地化本地化的InfoPlist.strings中的应用程序显示名称时,就像这样我们覆盖存储在Info.plist中的值,并丢失后缀字符.这有什么好办法吗?

  9. iOS – 开始iOS教程 – 变量之前的下划线?

    这是正确的还是我做错了什么?

  10. ios – 静态计算变量被多次实例化

    我有一个日期格式化程序,我试图在UITableViewCell子类中创建一个单例,所以我创建了一个这样的计算属性:问题是我不止一次看到print语句,这意味着它不止一次被创建.我已经找到了其他方法,但我很想知道这里发生了什么.有任何想法吗?解决方法您的代码段相当于只获取属性,基本上它与以下内容相同:如果你只想运行一次,你应该像定义一个惰性属性一样定义它:

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部