不再犹豫
分享是一种美德

JavaScript基础到入门练习013-JS简单数据类型and数字型

wangtong阅读(1325)

JS把数据类型分为两大类:

  • 简单数据类型(Number,String,Boolean,Undefined,Null)
  • 复杂数据类型(object)

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

简单数据类型说明默认值
Number数字型,包含整型值和浮点型值。如:12,1.20
String字符串类型,字符串需要带引号“”
Boolean布尔值类型,如true(等价于1)、false(等价于0)false
Undefinedvar a;表示声明的变量没有赋值。undefined
Nullvar a = null; 声明的变量赋值为nullnull

1.1 数字型 Number (可以分为整数和小数(浮点数))

var num = 10;// 整数
var Num = 1.2;// 小数

1.1.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开头。

1.1.2 数字型范围(js数值最大值和最小值)

console.log(Number.MAX_VALUE);//最大值:1.7976931348623157e+308
console.log(Number.MIN_VALUE);//最小值:5e-324

1.1.3 数字型的三个特殊值(无穷大、无穷小、非数值)

console.log(Number.MAX_VALUE*2);//无穷大:Infinity
console.log(-Number.MAX_VALUE*);//无穷小:-Infinity
console.log('age' - 100);//非数值:NaN

1.1.4 isNaN()

用来判断变量是否为非数字类型,返回true或者false

	var usrAge = 18;
	var isOk = isNaN(usrAge);
	console.log(isOk);//false ,21不是一个非数字
	var usrName = 'uname';
	console.log(isNaN(usrName));//true ,"uname"是一个非数字。

JavaScript基础到入门练习012-JS数据类型简介

wangtong阅读(1211)

学习目标:

1、可以说出五种简单的数据类型

2、可以使用typeof查看变量的类型

3、可以说出1–2种转换为数据型的方法

4、可以说出1–2种转换为字符型的方法

5、知道隐式转换是什么?

~~~~~~~~~~~~~~~华丽分割线~~~~~~~~~~~~~~~~

1、数据类型简介

1.1 为什么需要数据类型

计算机中不同的数据所占的存储空间不同,为了合理的利用存储空间,所以定义了不同的数据类型。

简单来说,数据类型就是数据的类别型号。

1.2 变量的数据类型

变量是用来存储值的所在处,它们有名字和数据类型。变量的数据类型决定如何将代表这些值的位存储到计算机的内存当中。

js是一种弱类型或动态语言,所以不需要提前声明变量类型。

	var num = 10;// num 数字型
	var str = 'name';// str 字符串型

js在代码运行时,变量的数据类型是由js引擎根据所赋的值来判断的。

js拥有动态类型,同时也意味着相同的变量可用做不同的类型。


	var x = 10;// x 数字型
	x = 'name';// x 字符串型 

JavaScript基础到入门练习011-JS变量小结

wangtong阅读(1060)

1、为什么需要变量?

因为我的一些数据需要保存,所以我们需要变量。

2、变量是什么?

变量其实就是一个容器,用来存储数据的,我们可以使用里边的数据进行处理。

3、变量的本质是什么?

变量是内存里的一块空间,用来存储数据。

4、变量怎么使用?

a、使用变量的时候一定要声明变量,然后赋值。

b、声明变量本质是去内存申请空间。

5、变量的初始化?

即声明变量并赋值。

6、变量命名规范有哪些?

命名尽量规范,见名知意,采用驼峰,区分大小写。

7、交换变量的思路?

采用中间临时变量。

JavaScript基础到入门练习010-JS变量练习

wangtong阅读(1092)

交换两个变量的值,使用临时变量用来做中间存储。

<!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>js变量练习</title>
<script>
	//1、创建一个临时变量 temp
	//2、把 a1 的值传给 temp
	//3、把 a2 的值传给 a1
	//4、把 temp 的值传给 a2
	var temp;
	var a1 = '原始a1';
	var a2 = '原始a2';
	temp = a1;
	a1 = a2;
	a2 = temp;
	console.log(
		'新的a1:'+a1,
		'新的a2:'+a2
	);
</script>
</head>
<body>
</body>
</html>

JavaScript基础到入门练习009-JS变量的命名规范

wangtong阅读(6905)

在javaScript中,变量名需要遵循以下规则:

1.首字母必须是字母、下划线(-)或者美元符号($)。

2.其他字母可以是下划线(_)、美元符号($)、字母或者数字。

3.一般采用驼峰法:第一个字母小写,其余有意义的单词首字母大写。

4.变量名是区分大小写的,不能是关键字或保留字。比如:var for if

5.变量名必须有意义,尽量不要采用简写。

//正确的命名

var  width =100;

var  _height=200;

var  $2=15;

var myName=“kim”;

//错误的命名

var  2th=2;//不能以数字开头

var typeOf=15;//不能是关键字或保留字

变量的命名区分大小写

var a=1;

var A=1;

这里a与A不是同一个变量。

此外javaScript的标识符是指变量、函数、属性的名字,或者函数参数的名字。标识符的命名规则和变量的命名规则是一样的。

<!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>js变量命名规范</title>
<script>
	var app = '10';
	var App = '100';
	console.log(app);//输出 10
	console.log(App);//输出 100
</script>
</head>
<body>
</body>
</html>

JavaScript基础到入门练习008-JS变量的语法扩展

wangtong阅读(1143)

1、更新变量

一个变量被重新复赋值后,其原来的值就会被覆盖掉,其值将以最后一次赋值为准。

	var myname = 'Mr.Naas';
	console.log(
		'myname is:'+myname,
		);
//输出 Mr.Naas
	myname = 'new name';
	console.log(
		'mynewname is:'+myname,
		);
//输出  new name

2、声明多个变量

同时声明多个变量,只需要一个var,多个变量名之间用英文逗号分割,最后一个用分号。

	var address = 'XXXXXXX',
		age = 18,
		email = 'mrnaas@mrnaas.com',
		gz = 2000;

3、声明变量的特殊情况

//3、声明变量的特殊情况
	//3.1只声明不赋值  结果?
	var sex;
	console.log(sex);
	//输出  undefined
	//3.2 不声明 不赋值 直接使用 结果直接报错
	// console.log(tel); //报错  tel is not defined
	//3.3 不声明 直接赋值
	qq = 111;
	console.log(qq);
	// 输出结果 111

完整代码如下

<!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>js变量语法扩展</title>
<script>
	//1、更新变量
	var myname = 'Mr.Naas';
	console.log(
		'myname is:'+myname,
		);
	myname = 'new name';
	console.log(
		'mynewname is:'+myname,
		);
	//2、声明多个变量

	// var address = 'XXXXXXX';
	// var age = 18;
	// var email = 'mrnaas@mrnaas.com';
	// var gz = 2000;

	var address = 'XXXXXXX',
		age = 18,
		email = 'mrnaas@mrnaas.com',
		gz = 2000;
	//3、声明变量的特殊情况
	//3.1只声明不赋值  结果?
	var sex;
	console.log(sex);
	//输出  undefined
	//3.2 不声明 不赋值 直接使用 结果直接报错
	// console.log(tel); //报错  tel is not defined
	//3.3 不声明 直接赋值
	qq = 111;
	console.log(qq);
	// 输出结果 111
</script>
</head>
<body>
</body>
</html>

JavaScript基础到入门练习006-JS输入输出语句

wangtong阅读(1182)

为了方便信息的输入输出,js提供了输入输出语句,常用的如下:

1、alert(msg)【浏览器弹出警示框】

2、console.log(msg) 【浏览器控制台输出内容】

3、prompt(msg) 【浏览器弹出输入框,提供用户进行输入】

<!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>js注释</title>
<script>
	//这是一个输入框
	prompt('请输入您的姓名!');
	//弹出警示框  输出展示给用户的
	alert('1、我是alert!');
	//控制台输出  程序员测试使用
	console.log('我是测试日志!');
</script>
</head>
<body>
</body>
</html>

下一篇开始学习JS变量

JavaScript基础到入门练习005-JS注释

wangtong阅读(888)

js注释分为单行注释和多行注释:

<!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>js注释</title>
<script>
	//1、单行注释
	/*
	2、多行注释
	*/
</script>
</head>
<body>
</body>
</html>

下一篇学习js输入输出语句

JavaScript基础到入门练习004-JS初体验

wangtong阅读(1599)

JS代码书写位置有三种:行内、内嵌、外部。

1、行内js

<!-- 1、行内js代码 直接写在元素内部-->
<input type="button" value="问候" onclick="alert('hello world!')">

(1)适用于单行或者少量的js代码写在HTML标签的事件属性中(on开头):例如:onclick

(2)注意单双引号使用,HTML推荐使用双引号,JS中推荐使用单引号

(3)写在行内可读性差,引号易错,引号多层嵌套易混乱,仅推荐在特殊情况下使用。

2、内嵌js

<!-- 2、内嵌的js代码 -->
<script>
	alert('内嵌js!!');
</script>

(1)可以将多行的js代码写在javascript标签中,是我们常用的

3、外部js

<!-- 3、外部js javascript 栓标签 -->
<script src="./js/test001js初体验.js"></script>

(1)有利于HTML页面代码结构化,可以将大量的jd代码独立于HTML页面之外,既美观又可以实现文件的复用性。

(2)引用的外部js文件的javascript标签中不可以写代码的。

(3)适用于代码量比较大的情况下。

<!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>js初体验</title>
<!-- 2、内嵌的js代码 -->
<!-- <script>
	alert('内嵌js!!');
</script> -->
<!-- 3、外部js javascript 栓标签 -->
<!-- <script src="./js/test001js初体验.js"></script> -->
</head>
<body>
	<!-- 1、行内js代码 直接写在元素内部-->
	<!-- <input type="button" value="问候" onclick="alert('hello world!')"> -->
</body>
</html>

下一篇学习js注释!

JavaScript基础到入门练习003-js组成

wangtong阅读(1322)

JS由三部分组成:

ECMAScript(JavaScript语法)基础主要学习此点 学习基本语法

(1)JavaScript(网景)或Jscript(微软)

(2)ECMAScript规定了js的编程语法和基础核心,是所有浏览器厂商共同遵守的一套js语法工业标准。

DOM(页面文档对象模型) jsapi

W3C组织推荐的处理可扩展标记语言的标准接口编程,通过DOM提供的接口操作页面元素。

BOM(浏览器对象模型)jsapi

提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。通过BOM可以操作浏览器的窗口,弹框、控制浏览器跳转等。

下一篇学习js初体验!