ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

2022-07-12 第二组 曹雨 JS

2022-07-13 00:31:28  阅读:158  来源: 互联网

标签:曹雨 12 console log 10 v1 let year 07


Java Script

编程语言,脚本语言(依赖于某种容器来运行 Java Script 依托于浏览器来运行 由浏览器来解释执行)
JS是运行在浏览器上的,可以帮助我们去控制页面。程序员有一条不成文的规定,JS放在结束标签的上方,也可以外部引入JS

外部引入JS的方法:

<script src="#"></script> 

JS的数据类型

1.数字 (number):整数,正数,小数,负数.......

2.字符串(string):a,中文,#,@,......

3.布尔型(boolean):ture(1) false(0)

4.空(null):相当于声明了值为空

5.undefined:未定义:相当于没有值

<body>

<script>
    //变量
    // number类型
    var v1 = 11;
    // 字符串类型
    // 加引号会把变量变成字面量
    var v2 = '你好';
    // 布尔类型
    var v3 = true;
    // 空
    var v4 = null;
    // undefined
    var v5;
    // 字面量
     alert(v5);
</script>
<!-- <script src="js/my.js"></script> -->
</body>

定义变量:

变量:

开发中尽量减少使用字面量,后期维护困难的问题。

在JS的新版本中,新推出了两个词代替var

1.let 无法重复定义

2.const 由let的特点, const声明的东西是常量,不能修改

重复写两个会报错

<body>

<script>
    // var v1 = 10;
    // let v1 = 10;
    // let v1 = 100;
    const v1 = 10;
    // const v1 = 11;
    // 修改变量的值
    // v1 = 11;
    // 10
    // 11
    // 报错
    alert(v1);
</script>
</body>

JS复杂数据类型

1.数组:一个变量对应多个值

创建数组:

数组的赋值,取值

<body>

<script>
    // 1.使用数组函数
    let arr1 = Array();
    // 警告弹窗
    // alert(arr);
    // console.log(11111);
    // console.log(arr);
    // 2.使用new关键字
    let arr2 = new Array();

    // 3.使用字面量的方式
    let arr3 = [];
    // 赋值
    // 下标(索引)
    // 给数组的第一个元素赋值
    arr3[0] = 100;
    arr3[1] = 90;
    // 打印输出数组中的第一个值
    console.log(arr3[100]);
</script>
</body>

函数:

定义一个函数用来执行一系列代码。以达到复用的目的!

*函数:一个单词后面带小括号一定是一个函数义:
定义函数:

 // 全局变量
    // let v1 = 10;
    // 定义函数 体
    // 作用域:起作用的区域
    function hello() {
        // 局部变量
        let v1 = 10;
        console.log(v1 + 5);

调用函数:

// 调用函数
    // hello();
    // console.log(v1);
    function add() {
        let num1 = 10;
        let num2 = 20;
        // console.log(num1 + num2);
        // 带有返回值的函数
        return num1 + num2;

    }

全局变量,局部变量:

 // 全局变量
    // let v1 = 10;
    // 定义函数 体
    // 作用域:起作用的区域
    function hello() {
        // 局部变量
        let v1 = 10;
        console.log(v1 + 5);
    }

给参数赋值

 // 给参数赋值
    function sub(num1,num2){
        
        return num1 - num2;
    }
    let result = sub(2,2);
    console.log(result);

函数分为:
1.无参无返回值 2.无参有返回值 3.有参有返回值 4.有参无返回值
函数内部不可以再声明函数,但是可以调用函数,调用方式和正常调用方式相同
return除了可以返回结果,还可以终止函数的继续执行。在开发中尽量不要在return后面继续写语句

弹窗:

1.alert警告弹窗
2.confirm带有确定和取消的弹窗有返回值 确定返回ture 取消返回false
3. prompt:带有文本框的弹窗,有返回值 返回值就是你在文本框内输入的内容。
4. \n换行

<script>
    let result = confirm("是否退出本系统?");
    console.log(result);
    let result = prompt("请输入你的学号:","例如:1001");
    console.log(result);
    alert("\t床前明月光,\r\n疑是地上霜。");

</script>

运算符:

算术运算符:

+ - * / %(取余,取模) 
console.log(5 % 2);
赋值运算符 = += -= *= /= %=

比较运算符:

比较运算符 > < >= <= != == ===
    // 得到的结果是boolean类型

三元运算符:
语法是固定的,只能有一个条件,两个选项
语法格式:
条件表达式 ? 表达式1 : 表达式2

let max = a > b ? a : b;
“+”加号:

"+"符号,可以当作连接符 如:10 + a =10a,但如果先入为主认定“+”是连接符,那么他就一直是连接符,后面即使有数字也加不了,如果非要加可以加一个“( )”

“- * / % ”符号可以进行类型转换,如果类型无法转换,会出现“NAN(Not A Number)”

逻辑判断:

if..else..

if(a < 10) {
         console.log("a < 10...");
    } else if(a === 10){
         console.log("a==10");
         return;
         console.log("我是return后面的一句话");
    }
    else {
        
    }

if...else是可以嵌套的,可以无限嵌套。但是原则上不要超过三层。

switch

语法:

switch(表达式){

​ case 选项1:

​ 要执行的代码

​ break

​ case 选项2:

​ 要执行的代码

​ break

​ case 选项3:

​ 要执行的代码

​ .......

​ default:

}

<script>
    let a = 100;
    switch(a) {
        case 10:
            console.log('你好');
            break;
        case 20:
            console.log('我好');
            break;
        default:
            console.log('大家好');
            break;
                
    }
</script>

判断润年小案例

let year = 2020;
    if(year%400 == 0){
        console.log(year + "是闰年。");
    }else {
        if(year%4 == 0 &&year % 100 != 0){
            console.log(year + "是闰年。");
        }else{
            console.log(year + "不是闰年。");
        }
    }
    function isRun(year){
        if(year % 400 == 0){
            console.log(year + "是闰年");
            return ;
        }
        if(year % 4 == 0 && year % 100 != 0){
            console.log(year + "是闰年");
            return ;
        }
        console.log(year + "不是闰年");
    }
    isRun(2100);

公司招人小案例:

function isRun2(year){
        switch(year % 400){
            case 0:
                console.log(year + "是闰年"); 
                return;
            default:
                if(year % 4 == 0 && year % 100 != 0){
                    console.log(year + "是闰年");
                    return;
                }
                console.log(year + "不是闰年");
        }
    }
    isRun2(2100)

判断天数小案例:

<body>
<script>
    // 给你一个年月日,今天是今年的第几天?
    let year = 2020;
    let month = 3;
    let day = 11;

    
    /*
        思路:
        1、判断2月份有几天,判断是不是闰年
        2、如果是闰年,2月份有29天
    */
    function getCountDays(year,month,day){
        let count = 0;
        switch(month){
        case 1:
            count = day;
            break;
        case 2:
            count = 31 + day;
            break;
        case 3:
            // let a = 0;
            // if(isRun2(year)){
            //     a = 29;
            // }else {
            //     a = 28;
            // }
            count = 31 + (isRun2(year) ? 29 : 28) + day;
            break;
        }
        return count;
    }
    console.log(year + "年" + month + "月" + day + "日是" + year + "年的第" + getCountDays(year,month,day) + "天!" );
    function isRun2(year){
        switch(year % 400){
            case 0: 
                return true;
            default:
                if(year % 4 == 0 && year % 100 != 0){
                    
                    return true;
                }
                return false;
        }
    }
</script>
</body>

总结:

今天开始了设计逻辑的js学习,在基础知识点学习后,老师带我们做了几个小案例,设计单一知识点的案例我完成的都可以,但是一旦设计知识点综合应用,我便无从下手。在老师进行示范后,才有了思路。感觉自己编程思维还需要培养。

标签:曹雨,12,console,log,10,v1,let,year,07
来源: https://www.cnblogs.com/figh466/p/16472340.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有