发表于: 2020-08-22 20:09:52

1 1331


今天完成的事情:(一定要写非常细致的内容,比如说学会了盒子模型,了解了Margin)

1.学习Math方法 floor方法 radom方法 

2.Shuffle 打乱数组下标方法 

3.  randomlyColor 随机获取颜色函数


js Math

什么是Math?函数的一种 ,无需创建

为甚用?用于执行数学任务

怎么用?通过Math作为对象使用,可以调用方法和属性 

语法

var pi_value=Math.PI;

var sqrt_value=Math.sqrt(15);

注释 

变量 pi=数学函数 .圆周率 属性 返回 

变量 sqrt=属性函数 数平方跟 方法 返回

实际代码


Math floor方法

是什么 运算函数的其中一个方法 返回小于等于x的最大整数

为什么 方便计算

怎么用

Math.floor(x)必需。任意数值或表达式。

例子

<p id="demo">单击按钮将不同的数值降到离它最近的整数。</p>

<button onclick="myFunction()">点我</button>

<script>

function myFunction(){

var a=Math.floor(0.60);

var b=Math.floor(0.40);

var c=Math.floor(5);

var d=Math.floor(5.1);

var e=Math.floor(-5.1);

var f=Math.floor(-5.9);

var x=document.getElementById("demo");

x.innerHTML=a + "<br>" + b + "<br>" + c + "<br>" + d + "<br>" + e + "<br>" + f; 

}

</script>

注释

执行的是向下取整计算,它返回的是小于或等于函数参数,并且与之最接近的整数。

小于等于 x,且与 x 最接近的整数。

对一个数进行下舍入 整数取整 0.1 取零 -5.1 取-6 


Math 方法 random()

是什么 计算函数中的一个方法,返回0和1之间的一个随机数

为什么 暂时不知道 看起来像是比对作用

怎么用 

语法 Math.random()

0.0 ~ 1.0(不包含) 之间的一个伪随机数

背景知识 

这是返回值 0-1 之间的 0.7105500664206326

例子

场景 返回1-10的之间的随机数 

<p id="demo">点击按钮显示 1 到 10 的随机数:</p>

<button onclick="myFunction()">点我</button>

<script>

function myFunction(){

var x=document.getElementById("demo")

x.innerHTML=Math.floor((Math.random()*10)+1);

}

</script>

注释

Math.floor((Math.random()*10)+1);

floor选取最小值 、*10 一个值,+1 一个值,都包含在random方法里面 


场景 随机获得3个div  

知识点1

Shuffle 函数 也叫洗牌操作

是什么  打乱数组下标的方法 

为什么 完成打乱的场景 

把一组图片顺序有正常但是变得乱七八糟,人移动恢复正常,完成人机验证

猜想: 定义好的数组不能不能用 按照口语化的说法,必须打乱牌的顺序,才能玩游戏 

正常牌是 123456 打乱牌是 635241 

那就是随机抽取 数组下标 也就是3个div不同的下标?

怎用?


类似例子1



类似例子2

从头遍历,每次从后面的牌中选一个与前面的交换(并不能完全随机)

function washCard1 (cards) {

  var len = cards.length

  for (var i=0; i<len; i++) {

    var index = Math.ceil( Math.random() * (len-i-1)) + i

    var tmp = cards[i]

    cards[i] = cards[index]

    cards[index] = tmp

  }

  return cards

}


知识点2

数组

什么是?数组数组 顾名思义 在一个组合多个数字吗 

单一变量中存储多个值 ,

场景 有的个人怀1个娃 ,有的人怀7-10个娃

为什么用?满足只有一个变量,并且有必须存多个值的场景 

更快的遍历速度 

怎么用?

1.数组文本创建

例子

<script>

var cars = ["Audi", "BMW", "porsche"];

document.getElementById("demo").innerHTML = cars;

</script>

cars 数组名称 ,数组值1 数组值2  

注意加 方括号  双引号 

输出cars数组 文本

js创建数组  new

例子

<script>

var cars = new Array("Audi", "BMW", "porsche");

document.getElementById("demo").innerHTML = cars;

</script>

注释

关键 var cars = new Array ,这一句出来cars能变,其他不能变 


背景知识

1.数组下标是什么?

以一个简单的一维数组为例bai:

int a[10];这是du一个整型的数组a,有10个元素:a[0]-a[9],因为正确的下zhi标应该是从0开始,到dao9结束,与生活习惯中的1-10不一样,于是产生一个a[10]的错误,即数组下标越界。

2.数组长度怎么计算?

3.a[i] 这是什么意思?

a[i]=i是一个循环赋值。bai

第一次循环:a[0]du=0;第二次循环:a[1]=1;一直zhi到第9次循环:a[9]=9。

int a[ ]中,a表示数组dao名,代表数组的首地址,可以看成一个常量,不可更改。

3.1 代码例子

var a = [];  //声明空数组

a[100] = 2;

console.log(a.length);  //返回101

3.2 注释

定义了一个空数组,然后为下标等于 100 的元素赋值,则 length 属性返回 101。因此,length 属性不能体现数组元素的实际个数

场景需要 随机给3个颜色


知识点 随机获取颜色的函数 randomlyColor

是什么 ? 颜色变化的控制方法 

为什么 ? 某些业务场景需要 比如对于黑夜时间,自动把网页变成黑色的降低对眼睛刺激 

或者制作节假日的跑马灯效果

怎么做?



明天计划的事情:(一定要写非常细致的内容)

1.研究洗牌写法

2.研究随机颜色写法


遇到的问题:(遇到什么困难,怎么解决的)

1.对于洗牌和随机颜色 没见过 这个有点懵逼 

麻烦师兄看看 这个两个方法注释  


洗牌

function Shuffle(a) {

    var length = a.length;

    for(var i = length - 1, rand;i >= 0; i--){

        rand = Math.floor(Math.random()*(i+1))

        var p = a[i];

        a[i] = a[rand];

        a[rand] = p ;  

    }

}


注释

/* shuffle 打乱函数 a数组名称 数组有 0-8 9个值

变量 length长度 =a函数的长度 ;

for循环语句 变量i的值=函数长度-1 9-1,rand随机变量 ,i值>=0, i--

for循环语句 场景化1 i的值减1是 8 ,但是没有满足小于等于0要求条件,8就自动递增减1

代码块

rand 随机变量  = 运算函数 floor() 方法返回的是小于或等于函数参数,并且与之最接近的整数

x的值是 random方法 返回0.0-1.0之间的数

假设

x值与i+1值 先假设x值随机到0.333 i+1值7 取值7 假设随机值 rand=7

内部变量 p的值 = a数组 【赋值i 】 8

a【i】值= a 【 赋值 rand 】 7

a【rand】=p ;

*/


随机颜色

function randomlyColor(){

    var red,blue,green;

    red = Math.floor(Math.random() * 256);

    do {

        green = Math.floor(Math.random() * 256);

    } while (green == red);

    do {

        blue = Math.floor(Math.random() * 256);

    }while(blue == red || blue == green);

    return("rgb(" + red + "," + green + "," + blue + ")");

}


注释

/* 函数声明 随机生成颜色函数

变量 红 蓝 green

red 红色值= floor返回下舍取整 random返回0-1的值 * 256

green 绿色 和红色的获取值条件一样

在什么期间

绿色等于红色值

蓝色 和绿色取值条件一样

在做什么期间 蓝色等于红色 或 蓝色等于绿色

返回 rgb的值是 3个参数计算后的值

*/


收获:(通过今天的学习,学到了什么知识)

1.js的运算方法

2.随机的两个方法


返回列表 返回列表
评论

    分享到