关于js基础复习与练习

最新推荐文章于 2023-06-15 19:06:48 发布

itlanmao

最新推荐文章于 2023-06-15 19:06:48 发布

阅读量255

点赞数

分类专栏：笔记文章文章标签： javascript

本文链接：https://blog.csdn.net/weixin_45558363/article/details/106958110

版权

笔记同时被 2 个专栏收录

74 篇文章 0 订阅

订阅专栏

文章

11 篇文章 0 订阅

订阅专栏

基础 JS
用户体验：JS在用户体验方面功不可没；
在真正的学习JS的过程之中，并没有什么炫酷的效果。

JAVASCRIPT：雷峰塔，nodejs做服务器
JAVA：雷锋，做服务器

语言很弱小，平台很强大。
变量：
Js里面的变量是弱类型，声明的时候不需要指定类型；
严格区分大小写。
变量的声明：
var声明变量， let声明变量；const声明静态变量；
变量的类型：
基础类型：基础类型里面的数据是不能修改的
数字、字符串、布尔(true, false)、null、undefined
Undefined:声明的变量没有赋值，
声明的函数没有返回值，
访问对象不存在的属性，
访问数组不存在的元素
Null：一切皆为对象(Object)，万物皆空。
引用类型：值可以直接修改
数组：本质就是对象；
对象：使用大括号，类（抽象）和对象（实例化）的关系；
JSON：也是对象类型
函数
构造函数：
函数名称首字母大写（推荐）；
事件
Js就是搞事情的；
事件三要素：
事件源：你操作的对象
事件:发生的动作
事件处理函数：具体要干什么，并实现什么效果

事件：开灯
事件源：开关
事件：点击
事件处理函数：接通火线

语法结构：
事件源.事件 = function（）{
具体的js代码
}
获取元素：
document.querySelector(‘选择器’)
document.querySelectorAll(‘选择器’)
定时器：
setTimeout
setInterval

双色球摇奖：
1.六个红球，一个蓝球；
2.红球取值范围1-33，并且不能重复；
3.蓝球取值范围1-16,不存在重复问题。
4.摇奖的时候多个数字不断的变换，最后确定一个；

代码：
JS变量类型

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>变量类型</title>
</head>
<body>
    <script>
        var a = 100;
        var $A = 200;
        console.log(a);
        console.log($A);
        // 获取数据类型
        console.log(typeof a);

        var str = 'abc';
        var  name = '张3';
        console.log(str, name);
        console.log(typeof name);

        var z;
        console.log(z);

        console.log(typeof null);

    </script>
</body>
</html>

数组：

<script>
        console.log(Math);
        var arr = new Array(1,2,3,4,5);
        console.log(arr);
        // 数组元素的增删改查
        arr.push(6,7,8);//在最后
        console.log(arr);
        arr.unshift(0);//在开始位置
        console.log(arr);

        // 删除元素
        console.log(arr.pop());
        console.log(arr);
        console.log(arr.shift());
        console.log(arr);
        //万能的
        // arr.splice(start, count, n1, n2, n3);
        var array = [100, 200, 300, 400, 500];
        array.splice(2, 0, 'a', 'b');
        console.log(array);
    </script>

随机抽取学生：

<script>
        function rand(min, max){
            return min + Math.round(Math.random()*(max-min));
        }
        // 随机一个名字 显示在指定位置
        document.getElementById('btn').onclick = function(){
            var students = [
                {name:'孙1',gender:'女', age:18},
                {name:'何2',gender:'女', age:18},
                {name:'蒋3',gender:'男', age:18},
                {name:'毛四',gender:'男', age:18},
                {name:'康5',gender:'男', age:18}
            ];
            var num = 0;
            var sid = setInterval(function(){
                var ind = rand(0, students.length-1);
                var name = students[ind].name;
                // 修改内容
                document.getElementById('student').innerHTML = name;
                num++;
                console.log(num);
                // 执行5次
                (num == 5) && clearInterval(sid);
            }, 103);
            
        }
    </script>

定时器：

<script>
       setTimeout(function(){
           console.log(1);
       }, 3000);

       setInterval(function(){
           console.log(100);
       }, 87);
    </script>

itlanmao

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
关于js基础复习与练习

基础 JS用户体验：JS在用户体验方面功不可没；在真正的学习JS的过程之中，并没有什么炫酷的效果。JAVASCRIPT：雷峰塔，nodejs做服务器JAVA：雷锋，做服务器语言很弱小，平台很强大。变量：Js里面的变量是弱类型，声明的时候不需要指定类型；严格区分大小写。变量的声明：var声明变量， let声明变量；const声明静态变量；变量的类型：基础类型：基础类型里面的数据是不能修改的数字、字符串、布尔(true, false)、null、undefinedUndefined
复制链接

扫一扫