JavaScript自学Day6-随机数函数和堆栈

随机数函数

Math.random() 随机数函数， 返回一个0 - 1之间的随机小数，其范围是[0, 1）(注意是左开右闭，包含0不包含1)

//生成一个0~10之间的随机整数
Math.floor(Math.random() * (11))  //范围：[0*11,1*11)，不包含11

//生成一个n~m之间的随机整数  
//取值范围：[n*(m-n+1)+n,m*(m-n+1)+n)
Math.floor(Math.random() * (m - n + 1) + n)
//或者
Math.floor(Math.random() * (m - n + 1)) + n

随机点名案例：

需求：请把 ['关羽', '张飞', '赵云', '马超', '黄忠'] 随机显示一个名字到页面中
分析： 
①：利用随机函数随机生成一个数字作为索引号 
②：数组[随机数] 生成到页面中 
③：数组中删除刚才抽中的索引号

let arr = ['关羽', '张飞', '赵云', '马超', '黄忠']
// 1.得到一个随机数， 作为数组的索引号
// 随机数的范围：[0*arr.length,1*arr.length)
let random = Math.floor(Math.random() * arr.length)
// 2.页面输出数组里面的元素
document.write(arr[random])
// 3.利用splice删除元素 splice(起始位置(下标), 删除几个元素)
arr.splice(random, 1)

猜数字游戏：

需求：程序随机生成 1~10 之间的一个数字，用户输入一个数字 
①：如果大于该数字，就提示，数字猜大了，继续猜 
②：如果小于该数字，就提示，数字猜小了，继续猜 
③：如果猜对了，就提示猜对了，程序结束

// 1. 随机生成一个数字 1~10
// 取到 N ~ M 的随机整数
function getRandom(N, M) {
	return Math.floor(Math.random() * (M - N + 1)) + N
}
let random = getRandom(1, 10)
// 2. 设定三次  三次没猜对就直接退出
let flag = true  // 开关变量 
for (let i = 1; i <= 3; i++) {
	// 用户输入
	let num = +prompt('请输入1~10之间的一个数字:')
	if (num > random) {
	alert('您猜大了，继续')
	} else if (num < random) {
	alert('您猜小了，继续')
	} else {
	flag = false
	alert('猜对了，真厉害')
	break
	}
}
// 次数用完，结束，写到for的外面来
if (flag) {
	alert('次数已经用完')
}

生成随机颜色：

需求：该函数接收一个布尔类型参数，表示颜色的格式是十六进制还是rgb格式。
①：如果参数传递的是true或者无参数，则输出 一个随机十六进制的颜色
②：如果参数传递的是false，则输出 一个随机rgb的颜色 
③：格式： 
function getRandomColor(flag){ } console.log(getRandomColor(true)) //#ffffff console.log(getRandomColor(false)) //rgb(255,255,255) 
分析： 
提示： 16进制颜色格式为: ‘#ffffff’ 其中f可以是任意 0-f之间的字符
提示: rgb颜色格式为: ‘rgb(255,255,255) ’ 其中255可以是任意0-255之间的数字

function getRandomColor(flag = true) {
	if (flag) {
		let arr = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f']
		let str = '#'
		for (let i = 1; i <= 6; i++) {
			let random = Math.floor(Math.random() * arr.length)
			str += arr[random]
		}
		return str
	}else{
		let r = Math.floor(Math.random() * 256)
		let g = Math.floor(Math.random() * 256)
		let b = Math.floor(Math.random() * 256)
		return `rgb(${r},${g},${b})`
	}
}
console.log(getRandomColor(false))

拓展

一些术语解释：

术语	解释	举例
关键字	在JavaScript中有特殊意义的词汇	let、var、function、if、else、switch、case、break
保留字	在目前的JavaScript中没意义，但未 来可能会具有特殊意义的词汇	int、short、long、char
标识（标识符）	变量名、函数名的另一种叫法	无
表达式	能产生值的代码，一般配合运算符出现	10 + 3、age >=18
语句	一段可执行的代码	if() for()

数据类型

ECMAScript中有6种简单数据类型（也称为原始类型），还有1种复杂数据类型obiect

简单类型又叫做基本数据类型或者值类型，复杂类型又叫做引用类型。

值类型： 简单数据类型/基本数据类型，在存储时变量中存储的是值本身，因此叫做值类型string，number，boolean，undefined，null，symbol(符号)，访问时是按值访问

引用类型： 复杂数据类型，在存储时变量中存储的仅仅是地址（引用），因此叫做引用数据类型；通过 new 关键字创建的对象（系统对象、自定义对象），如 Object、Array、Date等，访问时是按引用访问的

堆栈空间分配： 1、栈（操作系统）：由操作系统自动分配释放存放函数的参数值、局部变量的值等。其操作方式类似于数据结构中的栈。 简单数据类型存放到栈里面 2、堆（操作系统）：存储复杂类型(对象)，一般由程序员分配释放，若程序员不释放，由垃圾回收机制回收。 引用数据类型存放到堆里面

1. 简单数据类型的内存分配 值类型变量的数据直接存放在变量（栈空间）中

2. 复杂数据类型的内存分配 引用类型变量（栈空间）里存放的是地址，真正的对象实例存放在堆空间中

3. 思考

let num1 = 10      //值类型存放在栈中 
let num2 = num1    //赋值操作把num1栈中的值拷贝给num2
num1 = 20          //改变num1中的值
console.log(num2)  //结果为：10，说明num2中的值不受num1的影响

let obj1 = {
	age: 26
}                  //引用类型的变量存放的是地址，实例存放在堆中
let obj2 = obj1    //赋值操作把obj1栈中的地址拷贝给obj2
obj1.age = 18      //改变obj1.age为18
console.log(obj2.age)  //结果：obj2.age也为18，说明引用类型的变量只存放了该引用类型的地址