1、日期对象常用方法：

  1. <script>
  2.     // 创建日期对象方式1
  3.     var date1 = new Date();
  4.     console.log('date1=', date1);
  5.     // 方式2, 参数可以是一个日期的字符串
  6.     var date2 = new Date('2020-06-24');
  7.     console.log('date2=', date2);
  9.     // 方式3, 返回1970到现在的毫秒数
  10.     var date3 = Date.now();
  11.     console.log('date3=', date3);
  13.     // 方式4, 参数可以是一个毫秒数
  14.     var date4 = new Date(1624497306713);
  15.     console.log('date4', date4);
  17.     var date4 = new Date(0);
  18.     console.log('date4', date4);
  19. </script>

借助 BootCDN

  1. <script>
  2.     // 日期的常用方法
  4.     // 1.获取年月日时分秒 (月份+1)
  5.     var date = new Date();
  6.     var y = date.getFullYear();
  7.     var m = date.getMonth() + 1;
  8.     var d = date.getDate();
  9.     var h = date.getHours();
  10.     var M = date.getMinutes();
  11.     var S = date.getSeconds();
  12.     console.log(y);
  13.     console.log(m);
  14.     console.log(d);
  15.     console.log(h);
  16.     console.log(M);
  17.     console.log(S);
  19.     // 对小于10的数,前面加0
  20.     m = m < 10 ? '0' + m : m;
  21.     d = d < 10 ? '0' + d : d;
  22.     h = h < 10 ? '0' + h : h;
  25.     // 格式化日期
  26.     var dateStr = `${y}年${m}月${d}日 ${h}:${M}:${S}`;
  27.     console.log('现在时间是:', dateStr);
  29.     // 2.获取星期
  30.     var week = date.getDay();
  31.     console.log('week', week);
  33.     // 3.获取毫秒数, 和Date.now()一样
  34.     var ss = date.getTime();
  35.     console.log('ss', ss);
  37.     // 4.日期比较
  38.     var date1 = new Date('2021-06-24');
  39.     var date2 = new Date('2021-06-23');
  40.     console.log('date2-date1', date2 - date1); // -86400000
  41. </script>
  1. <head>
  2.     <meta charset="UTF-8">
  3.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  4.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  5.     <title>Document</title>
  6.     <script src="https://momentjs.bootcss.com/downloads/moment.js"></script>
  7. </head>
  9. <body>
  12.     <script>
  13.         var str = moment().format('YYYY-MM-DD hh:mm:ss');
  14.         console.log(str);
  15.     </script>
  16. </body>
  18. </html>

字符串常用方法：
1、length //获取字符串的长度
2、trim（） //去掉字符串前后的空格
3、toLowerCase( ) //转化为小写字母
4、toUpperCase() //转化为大写字母
5、charAt() // 返回某个下标对应的字符
6、indexOf() //返回字符在原字符串中的位置
7、lastIndexOf() //返回字符在原字符串中的位置，但从后面开始检测
8、includes() //检查字符串中是否包含指定字符
9、split() //字符串转数组，接收一个参数，作为转化的标志
10、substring() //截取字符串，接收两个参数，开始的位置和结束的位置
11、slice() //截取字符串，用法类似于subString，开始位置到结束位置。。但是可以复数，，若只有一个参数，则是 从当前位置到结束
12、substr() //截取字符串，接收两个参数，第一个参数是 开始位置，一个是截取的字符个数
13、match() //检查有没有包含某个值，返回符合一个数组，存放符合条件的字符
14、replace() //替换

  1. <script>
  3.     // 1.length  // 字符串的长度
  4.     var str1 = 'asdfasdfasdf';
  5.     console.log('str1', str1.length);
  7.     // 2.trim()  // 去掉字符串前后的空格
  8.     var str2 = ' aaaaaaaaa ';
  9.     var newStr2 = str2.trim();
  10.     console.log('str2', str2);
  11.     console.log('newStr2', newStr2);
  13.     // 3.toLowerCase()  // 转小写字母
  14.     var str3 = 'asdfASDFasdfs';
  15.     var newStr3 = str3.toLowerCase();
  16.     console.log('newStr3', newStr3);
  17.     // 4.toUpperCase()  // 转大写字母
  20.     // 5.charAt()  // 返回某个下表对应的字符
  21.     var str5 = 'abcde';
  22.     var chat5 = str5.charAt(1);
  23.     console.log('chat5', chat5);
  25.     // 6.indexOf()  // 返回字符(字符串)在原字符串中的的位置
  26.     var str6 = 'abcdef';
  27.     var index6 = str6.indexOf('b');
  28.     console.log('index6=', index6);
  30.     // 7.lastIndexOf() // 同上,但从后面开始检查
  31.     var str7 = 'abcdebf';
  32.     var index7 = str7.lastIndexOf('b');
  33.     console.log('index7=', index7);
  35.     // 8.includes()  // 检查字符串是否包含指定字符
  36.     var str8 = '我是中国人';
  37.     var boo8 = str8.includes('我');
  38.     console.log('boo8', boo8); // true
  40.     // 9.split()   // 字符串转数组,接收一个参数,作为转换的标志
  41.     var str9 = '刘享高危,林玉生,刘顺顺';
  42.     var arr9 = str9.split(',');
  43.     console.log('arr9=', arr9);
  45.     // 10.substring()  // 截取字符串,接收两个参数,开始的位置和结束的位置(不含), 有了slice,就很少substring
  46.     var str10 = 'abcdefg';
  47.     var newStr10 = str10.substring(1, 4);
  48.     console.log('newStr10=', newStr10) // bcd
  50.     // 11.slice()  截取字符串(极常用), 用法类似substring, 但可以是负数
  51.     var str11 = 'abcdefg';
  52.     var newStr11 = str11.slice(1, 4);
  53.     console.log('newStr11=', newStr11) // bcd
  55.     var newStr11 = str11.slice(1, -1); // 参数可以是负数
  56.     console.log('newStr11=', newStr11) // bcdef
  58.     var newStr11 = str11.slice(-1); // 第二个参数不给,从参数的位置开始,一直截取到最后
  59.     console.log('newStr11=', newStr11) // g
  61.     var phone = 13811112222;
  62.     var phoneStr = phone + '';
  63.     var newStr11 = phoneStr.slice(-4); // 从-4的位置开始截取到末尾
  64.     console.log('newStr11=', newStr11);
  66.     // 12.substr()  截取字符串, 接收两个参数,第一个参数是开始位置, 第二个参数是截取的字符个数
  67.     var str12 = 'abcdef';
  68.     var newStr12 = str12.substr(1, 3);
  69.     console.log('newStr12', newStr12);
  71.     // 13.match()  // 检查有没有包含某个值, 返回符合一个数组,存放符合条件的字符
  72.     var str13 = 'abcdeabcdabcd';
  73.     var arr13 = str13.match('a');
  74.     console.log('arr13', arr13);
  75.     // 正则
  76.     var arr13 = str13.match(/a/g);
  77.     console.log('arr13', arr13);
  79.     // 14.replace()  // 替换
  80.     var str14 = '张三,李四,王五,张三,陈六,张三';
  81.     var newStr14 = str14.replace('张三', '张无忌');
  82.     console.log('newStr14=', newStr14);
  84.     // 15.替换全部,使用replaceAll或者正则
  85.     var newStr14 = str14.replaceAll('张三', '张无忌');
  86.     console.log('newStr14=', newStr14);
  88.     var newStr14 = str14.replace(/张三/g, '张无忌');
  89.     console.log('newStr14=', newStr14);
  91. </script>

2、Math 对象

JS Math对象允许你对数字执行数学任务

  1. 四舍五入   Math.round()
  2. 向上取整    Math.ceil()
  3. 向下取整    Math.floor()
  4. 绝对值      Math.abs()
  5. 平方根       Math.sqrt()
  6. 最大值和最小值   Math.min()     Math.Max()  可用于查找参数列表中的最小值和最大值
  7.                Math.min(192,2980,22,23,12,-28);    //结果 -28
  8. 随机数          Math.random()   //返回0~1的随机数
  9.                Math.random()*(max-min)+min  //介于min~max之间的随机数

3、数组方法

1、pop() 删除数组的最后一个元素并返回删除的元素。
2、 push() 向数组的末尾添加一个或更多元素，并返回新的长度。
3、 shift() 删除并返回数组的第一个元素。
4、 unshift() 向数组的开头添加一个或更多元素，并返回新的长度。
5 、map()。对原来成员改头换面
6、 filter() 检测数值元素，并返回符合条件所有元素的数组。
7、 forEach() 遍历数组。
8、 isArray() 判断对象是否为数组。
9、 find() 返回符合传入测试（函数）条件的数组元素。 // 只返回符合条件的第一个成员, 没有符合条件就返回 undefined
10、 findIndex() 返回符合传入测试（函数）条件的数组元素索引。
11、 indexOf() 搜索数组中的元素，并返回它所在的位置。
12、 lastIndexOf() 搜索数组中的元素，并返回它最后出现的位置。
13、 some() 检测数组元素中是否有元素符合指定条件。 // 用来判断数组是否包含符合条件的成员, 包含返回 true, 不包含返回 false
14、 includes() 判断一个数组是否包含一个指定的值。 // 成员只能是基本数据类型
15、 join() 把数组的所有元素放入一个字符串。
16、 slice() 选取数组的一部分，并返回一个新数组。
17、 splice() 从数组中添加或删除元素。
18、 sort() 对数组的元素进行排序。
19、 reverse() 反转数组的元素顺序。

  1. 数组里面能否放不同类型的数据？
  2. Array.isArray(数组名)
  3. arryname.includes('字符')
  4. arryname.join('-');  //"-"是分隔符，默认是逗号，也可以是其他
  5. arryname.reverse()
  6. arryname.slice(num1.num2)   //找到从第num1到第num2个字符，，，不包括第num2个字符
  7. arryname.push()   //在arrayname数组中添加新的元素，在末尾添加
  8. arrayname.pop()    //删除数组中的元素
  14. <script>
  15.     // 1. Array.isArray() 判断对象是否为数组。
  16.     var arr1 = [12, 3, 4, 5];
  17.     // var arr1 = new Array();
  18.     console.log(typeof arr1); // object
  19.     var boo1 = Array.isArray(arr1);
  20.     console.log('boo1', boo1);
  22.     // 2. includes() 判断一个数组是否包含一个指定的值。 // 成员只能是基本数据类型
  23.     var arr2 = ['a', 'b', 'c', 'd'];
  24.     var boo2 = arr2.includes('a'); // 
  25.     console.log('boo2', boo2);
  27.     // 3. join() 把数组的所有元素放入一个字符串。
  28.     var arr3 = ['a', 'b', 'c', 'd'];
  29.     var str3 = arr3.join('-'); // -是分隔符, 默认是逗号,也可以上是其他
  30.     console.log('str3=', str3);
  32.     // 4. reverse() 反转数组的元素顺序。
  33.     var arr4 = ['a', 'b', 'c', 'd'];
  34.     var newArr4 = arr4.reverse();
  35.     console.log('newArr4', newArr4);
  37.     // 5. slice() 选取数组的一部分，并返回一个新数组。类似字符串的slice方法
  38.     var arr5 = [1, 2, 3, 4, 5, 6, 7, 8, 9];
  39.     var newArr5 = arr5.slice(2, 5);
  40.     console.log('newArr5=', newArr5);
  42.     // 6. pop() 删除数组的最后一个元素并返回删除的元素。
  43.     var arr6 = [1, 2, 3];
  44.     arr6.pop();
  45.     console.log('pop', arr6);
  46.     // 7. push() 向数组的末尾添加一个或更多元素，并返回新的长度。
  47.     var arr7 = [1, 2, 3];
  48.     arr7.push(4);
  49.     console.log('push', arr7);
  51.     // 8. shift() 删除并返回数组的第一个元素。
  52.     // 9. unshift() 向数组的开头添加一个或更多元素，并返回新的长度。
  54.     // 10. map()。对原来成员改头换面,传入一个函数, 返回一个新的数组
  55.     var arr10 = [{
  56.         name: 'zs',
  57.         age: 10
  58.     }, {
  59.         name: 'ls',
  60.         age: 20
  61.     }, {
  62.         name: 'ww',
  63.         age: 30
  64.     }];
  65.     var newArr10 = arr10.map(function(item, index) {
  66.         // 对名字进行处理
  67.         var name = item.name.toUpperCase();
  69.         return {
  70.             name: name,
  71.             age: item.age - 10
  72.         };
  73.     });
  74.     console.log('newArr10=', newArr10);
  76.     console.log('----------11. filter()----------------')
  78.     // 11. filter() 检测数组元素，并返回符合条件所有元素的数组。
  79.     var arr11 = [{
  80.         name: 'zs',
  81.         age: 10
  82.     }, {
  83.         name: 'ls',
  84.         age: 20
  85.     }, {
  86.         name: 'ww',
  87.         age: 30
  88.     }];
  89.     var newArr11 = arr11.filter(function(item, index) {
  90.         return item.age >= 20;
  91.     });
  92.     console.log('newArr11=', newArr11);
  94.     console.log('----------12. forEach() ----------------')
  95.         // 12. forEach() 遍历数组。
  96.     var arr12 = [{
  97.         name: 'zs',
  98.         age: 10
  99.     }, {
  100.         name: 'ls',
  101.         age: 20
  102.     }, {
  103.         name: 'ww',
  104.         age: 30
  105.     }];
  106.     arr12.forEach(function(item, index) {
  107.         console.log(index, item);
  108.     });
  109.     console.log(str);
  111.     // for循环
  112.     var filmList = [{
  113.         filmName: '电影1',
  114.         time: 120
  115.     }, {
  116.         filmName: '电影2',
  117.         time: 120
  118.     }, {
  119.         filmName: '电影3',
  120.         time: 120
  121.     }, {
  122.         filmName: '电影4',
  123.         time: 130
  124.     }]
  125.     var str = '';
  126.     for (var i = 0; i < filmList.length; i++) {
  127.         var item = filmList[i];
  128.         str += `
  129.         <li><span>${item.filmName}</span> <span>${item}</span></li> 
  130.         `;
  131.     }
  132.     // document.querySelector('#list').innerHTML = str;
  134.     // forEach循环
  135.     var str = '';
  136.     filmList.forEach(function(item, index) {
  137.             str += `
  138.         <li><span>${item.filmName}</span> <span>${item}</span></li> 
  139.         `;
  140.         })
  141.         // document.querySelector('#list').innerHTML = str;
  144.     console.log('----------13. find() ----------------')
  145.         // 13. find() 返回符合条件的数组元素。 // 只返回符合条件的第一个成员, 没有符合条件就返回 undefined
  146.     var arr13 = [{
  147.         name: 'zs',
  148.         age: 10
  149.     }, {
  150.         name: 'ls',
  151.         age: 20
  152.     }, {
  153.         name: 'ww',
  154.         age: 30
  155.     }];
  156.     var newArr13 = arr13.find(function(item, index) {
  157.         // return item.name === 'zs';
  158.         return item.age > 10; // 只返回符合条件的第一个成员
  159.     });
  160.     console.log('newArr13=', newArr13);
  162.     console.log('----------14. findIndex() ----------------')
  163.         // 14. findIndex() 返回符合传入测试（函数）条件的数组元素索引。
  164.     var arr14 = [{
  165.         name: 'zs',
  166.         age: 10
  167.     }, {
  168.         name: 'ls',
  169.         age: 20
  170.     }, {
  171.         name: 'ww',
  172.         age: 30
  173.     }];
  174.     var index14 = arr14.findIndex(function(item, index) {
  175.         return item.age === 30;
  176.     });
  177.     console.log('index14=', index14);
  179.     // 15. indexOf() 搜索数组中的元素，并返回它所在的位置。
  180.     // 16. lastIndexOf() 搜索数组中的元素，并返回它最后出现的位置。
  182.     console.log('----------17. some()  ----------------')
  183.         // 17. some() 检测数组元素中是否有元素符合指定条件。 // 用来判断数组是否包含符合条件的成员, 包含返回 true, 不包含返回 false
  184.     var arr17 = [{
  185.         name: 'zs',
  186.         age: 10
  187.     }, {
  188.         name: 'ls',
  189.         age: 20
  190.     }, {
  191.         name: 'ww',
  192.         age: 30
  193.     }];
  194.     var boo17 = arr17.some(function(item, index) {
  195.         return item.age > 10;
  196.     })
  197.     console.log('boo17=', boo17);
  199.     console.log('----------18. splice() ----------------')
  200.         // 18. splice() 从数组中添加或删除元素。参数可以是2个或者3个
  201.     var arr18 = [{
  202.         name: 'zs',
  203.         age: 10
  204.     }, {
  205.         name: 'ls',
  206.         age: 20
  207.     }, {
  208.         name: 'ww',
  209.         age: 30
  210.     }];
  211.     arr18.splice(1, 1); // 两个参数,第1个参数表示下标,第2个参数,表示删除的成员个数
  212.     console.log('arr18', arr18);
  214.     var arr18 = [{
  215.         name: 'zs',
  216.         age: 10
  217.     }, {
  218.         name: 'ls',
  219.         age: 20
  220.     }, {
  221.         name: 'ww',
  222.         age: 30
  223.     }];
  225.     var item = {
  226.         name: '张欢',
  227.         age: 18
  228.     };
  229.     arr18.splice(1, 2, item); // 三个参数,第1个参数表示下标,第2个参数,表示删除的成员个数,第3个参数用来替代被删除的成员
  230.     console.log('arr18', arr18);
  232.     console.log('---------- 19. sort() ----------------')
  233.         // 19. sort() 对数组的元素进行排序。
  234.     var arr19 = ['a', 'c', 'x', 'd'];
  235.     var newArr19 = arr19.sort();
  236.     console.log('newArr19=', newArr19); // 按字母的升序排列
  238.     var arr19 = [1, 2, 10, 20, 8];
  239.     var newArr19 = arr19.sort();
  240.     console.log('newArr19=', newArr19);
  242.     // 传入一个函数参数,a-b升序排列,b-a降序排序
  243.     console.log('---------- 19. sort(),传入函数 ----------------')
  244.     var newArr19 = arr19.sort(function(a, b) {
  245.         return b - a;
  246.     });
  247.     console.log('newArr19=', newArr19);
  249.     console.log('---------- 19. sort(),成员是对象 ----------------')
  250.         // 成员是对象时也是如此
  251.     var arr19 = [{
  252.         name: 'zs',
  253.         age: 10
  254.     }, {
  255.         name: 'ls',
  256.         age: 20
  257.     }, {
  258.         name: 'ww',
  259.         age: 30
  260.     }, {
  261.         name: 'zh',
  262.         age: 18
  263.     }];
  264.     var newArr19 = arr19.sort(function(a, b) {
  265.         return b.age - a.age;
  266.     })
  267.     console.log('newArr19=', newArr19);
  268. </script>
  1. arryname.map(function(intem,index,整个数组){})  //三个参数
  2. arryname.foreach(function(item,index){})

浏览器内置对象 window(一般叫 BOM 对象)

  1. window
  2. window.open
  3. location对象
  4. location.href 获取浏览器地址
  5. location.href = ‘http://www.baidu.com‘ // 跳转到百度
  6. location.href = ‘http://www.baidu.com?username=huruqing‘
  7. history对象
  8. setTimeout 延迟
  9. setInterval 定时器
  10. navigation: user-agent

作业

  1. 登录倒计时
  2. 城市列表过滤