前端与移动开发----JavaScript 基础----数组，冒泡排序，获取系统日期等

JavaScript基础

数组

创建数组

• 字面量创建数组

var  自定义数组名称 = [] ;
注意：
  1.通过字面量方式定义数组,一定要写 [];
  2.数组的名称与变量的命名规则一样   

• 通过构造函数创建数组

var   自定义数组名称  = new Array();

数组赋值

• 创建数组并赋值

☞ 构造函数方式
	var ary = new  Array (1,2,3,5,6);
☞ 字面量方式赋值
	var ary = [1,2,3,4,6];
注意事项:
  1.数组中的值之间使用逗号隔开.
  2.数组中的值可以是任何的一种类型

• 通过索引方式赋值

var  ary = [];
	ary[0]=1;
	ary[1]=2;
总结：
  1.数组中索引值是从 0 开始的
  2.通过索引的方式给数组赋值，要按照顺序个数设置
  3.通过 数组名.length 可以获取到当前数组的长度

• 动态给数组赋值

var ary = ['a', 'b', 'c'];
        ary[ary.length] = 'f';
        console.log(ary);
总结：
  1.动态给数组赋值:数组名[数组名.length] = 值;
  2.数组长度： 数组名.length;

• 获取数组中的值

☞ 通过索引的方式获取数组中的值，数组的索引从0开始

☞ 语法：
	 数组名[索引号]

例如：
	 var  ary = [1,2,3,4,5];
	 ary[0];
	 ary[1];

• 案例

练习1：统计班级学生就业薪资，计算总薪资和平均薪资。
<script>
	//先得到班级人数
    var num = Number(prompt('请输入班级人数'));
    //动态的记录每一个学生的薪资
    var ary = [];
    var zxj = 0;
    //通过循环的方式给数组赋值
    for(var i = 0; i < num; i++) {
    //给数组赋值
    ary[ary.length] = Number(prompt('请输入第' + (i+1) + '个学生的薪资'));
    zxj += ary[i];
    }
	alert('总薪资' + zxj);
    alert('平均薪资' + zxj / ary.length);
</script>
练习2：统计班级学生就业薪资，计算薪资超过15000的人的个数。
<script>
      var num = Number(prompt('请输入学生人数：'));
      var ary = [];
      var rs = 0;
      for (var i = 0; i < num; i++) {
          ary[i] = Number(prompt('请输入薪资：'));
          if (ary[i] > 15000) {
              rs += 1;
          }
       }
       alert(rs);
  </script>
练习3：给一个不重复的数字数组，求最大值和最大值的在数组中的位置
<script> 
	var ary = [2, 40, 6, 1, 9, 8];
     //先假设数组中的某个值是最大值 2 是最大值
     var max = ary[0];
     var max_index = 0;
     //让假设的值分别和数组中的其他值比较大小, 如果假设的值比其他值还要大,说明当前值就是最大值, 如果有某个值比假设的值要大, 那么就将大的那个值重新复制给max
     for(var i = 1; i < ary.length; i++) {
           if(max < ary[i]) {
               max = ary[i];
               max_index = i;
           }
      }
      console.log(max + '对应的索引位置是: ' + max_index);
  </script>
练习4：给一个字符串数组，将数组中的每一个数据拼接在一起，每个数据之间用 | 符合拼接。 如： ‘张三|李四|王五’
<script> 
  var ary = ['张三', '李四', '王五'];
      var str = '';
      for (var i = 0; i < ary.length; i++) {
          if (i == ary.length - 1) {
              str = str + ary[i];
          } else {
              str = str + ary[i] + '|';
          }

      }
      console.log(str);
  </script> 
练习5：给一个数字数组，该数组中有很多数字0，将不为0的数据存入到一个新的数组中
<script>
        var str = [0, 17, 0, 69, 6, 0, 36, 0, 11, 0, 0, 1];
        var sum = [];
        var a = 0;
        for (var i = 0; i < str.length; i++) {
            if (str[i] != 0) {
                sum[a] = str[i];
                a++;
            }
        }
        console.log(sum);


    </script>
练习6：给一个数组，将数组中的数据反转，存放到一个新的数组中。
<script>
        var ary = ['a', 'b', 'c', 'd', 'e'];
        var a = [];
        var b = 0;
        for (var i = ary.length; i >= 0; i--) {
            a[b] = ary[i];
            b++;
        }
        console.log(a);
    </script>
练习7：给一个不重复的数字数组，求最大值和最大值的在数组中的位置 和 最小值和最小值的在数组中的位置
<script>
        var ary = [3, 6, 1, 5, 8, 7, 11, 2];
        var max = ary[0];
        var min = ary[0];
        var a;
        var b;
        for (var i = 1; i < ary.length; i++) {
            if (ary[i] > max) {
                max = ary[i];
                a = i;
            }
        }
        for (var i = 1; i < ary.length; i++) {
            if (ary[i] < min) {
                min = ary[i];
                b = i;
            }
        }
        console.log(max);
        console.log(a);
        console.log(min);
        console.log(b);
    </script>

• 冒泡排序

  1.数组冒泡排序:

  ​ 升序: 从小到大排列

  ​ 降序: 从大到小排列

  2.冒泡排序理解：

  1. 将一组数字进行相邻的值两两比较大小
  2. 在比较过程中涉及到交换位置（如果前一个值比后一个值大，就交换位置，升序）
  3. 如果前一个值比后一个值小，就交换位置，降序

var ary = [1, 4, 2, 3];
//先确定要比较的趟数(比总数少1)
for (var i = 0; i < ary.length - 1; i++) {
//需要将数组中每一个值进两两比较大小(遍历数组,得到数组中的每一个值)
    for (var j = 0; j < ary.length; j++) {
         if (ary[j] < ary[j + 1]) {
             // 交换位置
             var c = ary[j];
             ary[j] = ary[j + 1];
             ary[j + 1] = c;
          }
     }
  }
  console.log(ary);

操作字符串方式

• 分割字符串

字符串.split('分隔符')   //以一个分割符,将一个字符串串分割成一个数组

    <script> 
        // var num = prompt('请输入数字,以逗号隔开');
        // console.log(num);
        //分析:
        // 得到的num数据类型是字符串类型
        // 最后的值形式是  1,2,3
        //最后要实现的效果: 要将 1,2,3中的这几个数字进行数学相加

        //实现需要在字符串中将每一个数字单独取出
        var str = '1,2,3';
        // 截取字符串, 只有字符串才可以使用该方法
        // 字符串.split('分割符');
        // 通过 split 分割字符串后,最后得到的是一个数组
        // 将字符串分割后,赋值给一个变量
        var res = str.split(',');
        var sum = 0;
        // 遍历数组
        for(var i = 0; i < res.length; i++) {
           sum += Number(res[i]);
        }
        console.log(sum);

        //console.log(res);
    </script>

​

获取系统日期

• 获取系统时间

    var  日期变量 = new Date()
  

• 获取日期其他部分

  日期变量.getSeconds()  //获取秒
  日期变量.getMinutes()  //获取分钟
  日期变量.getHours()    //获取小时
  日期变量.getDay()      //返回周几   （0表示周日）
  日期变量.getDate()     //返回当前月的第几天
  日期变量.getMonth()    //返回月份   （从0开始）
  日期变量.getFullYear()  //返回年份
  注意：
   	getYear()  返回从 1900年到当前系统时间的差，不推荐使用。
  

• 案例

  1.将当前系统时间以  yyyy-mm-dd HH:mm：ss 输出到控制台中。
  <script>       
           //获取日期对象
           var mydate = new Date();
           var year = mydate.getFullYear();
           var month = mydate.getMonth() + 1;             
               month =  month < 10 ? '0' + month : month;
           var d = mydate.getDate();
               d = d < 10 ? '0' + d : d;
           var h = mydate.getHours();
              h = h < 10 ? '0' + h : h;
           var m = mydate.getMinutes();
            m = m < 10 ? '0' + m : m;
           var s = mydate.getSeconds();
            s = s < 10 ? '0' + s : s;
           var str = year + '-' + month + '-' + d + ' ' + h + ':' + m + ':' + s;
           console.log('当前系统时间是:' + str);
      
      </script>
  

与数学相关的操作

• 获取随机数

Math.random();
//随机数:  小数  [0, 1)

• 对数字取整

1.地板函数Math.floor( )
  a. Math.floor() 返回的永远都是一个整数
  b. 返回一个小于或等于当前数字且与其最接近的整数
  c. 如果当前数字本身就是一个整数,则就返回本身
2.天花板函数Math.ceil( )
  a. 返回的是一个大于或等于当前数字且最接近的一个整数
  b. 如果本身就是一个整数,则返回数字本身

• 案例

1.求 1 到 10之间的随机整数【包括边界值】
<script>
     //先产生一个随机数   [0, 1)
     var num = Math.random();
     //在随机数本身* 10
     // [0, 10)  ----> 小数
     //在值的基础上加1
     // [1, 11)
     // 4. 最后对值进行地板函数运算
     var num =  Math.floor(Math.random() *  10 + 1);
      console.log(num);
  </script>
2.求 20 到 50 之间的随机整数【包括边界值】
<script>
      //先产生一个随机数 
      //var num = Math.random();      [0, 1);       
      //在值的基础上 * 31
      //[0, 31)
      //在值的基础上 + 20
      //[20, 51)
      //地板函数运算
       var num =  Math.floor(Math.random() * 31 + 20);
       console.log(num);
  </script>
3.求m到n之间的随机整数(公式)
    Math.floor(Math.random()*(n-m+1)+m);
    Math.floor(Math.random()*(最大值-最小值+1)+最小值);

小娜案例

• 实现求和功能
• 实现获取当前系统日期功能
• 实现小娜讲笑话功能

<script>
        var flag = true;
        while(flag) {
            //获取用户输入信息 
            var code = prompt('你好,我是小娜\n请输入编号或者关键词选择功能,输入Q(q)退出聊天\n1.计算\n2.时间\n3.笑话');
            switch( code ) {
                case 'q':
                case 'Q':
                    alert('您要狠心的抛弃小娜吗？');
                    flag = false;
                break;
                case '1':
                case '计算':
                    var sum = 0;
                    var res = prompt('请输入你要求的数字，以逗号隔开,例如: 1,2,3,4');
                    if(res == 'Q' || res == 'q') {
                        flag = false;
                        alert('小娜退出');
                        break;
                    }else {
                        var ary = res.split(',');
                        for (var i = 0; i < ary.length; i++) {
                            if(isNaN(ary[i]) == false) {
                                sum += Number(ary[i]);
                            }else {
                                alert('有非法输入,小娜退出');
                                sum = 0;
                                break;
                            }
                        }
                        alert('最后的求和结果是:'+sum);
                    }
                break;

                case '2':
                case '时间':
                    var d = new Date();
                    var year = d.getFullYear();
                    var month = d.getMonth()+1;
                    var date = d.getDate();
                    var h = d.getHours();
                    var m = d.getMinutes();
                    var s = d.getSeconds();

                    month = month >= 10 ? month : '0' + month;
                    date = date >= 10 ? date : '0' + date;
                    h = h >= 10 ? h : '0' + h;
                    m = m >= 10 ? m : '0' + m;
                    s = s >= 10 ? s : '0' + s;

                    var timeStr = year + '-'+ month + '-' + date + ' '+ h + ':' + m + ':' + s;
                    alert('当前北京时间是:'+ timeStr);
                break;

                case '3':
                case '笑话':
                    var xh = ["为什么结婚都喜欢选好日子，因为结婚后都没有好日子。","为什么超人都喜欢穿紧身衣，因为救人要紧","火柴有个问题想不懂，然后就挠头，自己燃烧了自己","包子跑步，为什么在路上消失了，因为太饿自己把自己吃了","没钱真的太惨了，我只有1块钱，连2元店的吃亏上当都买不到！！！","本来想吃一口，结果吃了一宿；本来想去夜跑，结果遇上烧烤。","常在河边走，微信步数会比较多。"];

                    var random = Math.floor(Math.random()*5);
                    alert(xh[random]);
                break;

                default:
                    alert('您说的什么，小智也不明白');
                break;
            }

        }     
    </script>

如有不足，请多指教，
未完待续，持续更新！
大家一起进步！