HTML+CSS实训——Day05——JavaScript基础知识点

news2024/10/2 6:31:09

前言

上一周我们只做了静态页面,这周开始要学js了,那我们先来认识一下他的语法和变量吧。

知识点

变量定义

学习了var还有console.log()输出变量

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        //var 变量 = 值
        var a=1
        var b=1.1
        var c=1
        var d=1.1
        //在控制台打印输出变量的内容
        console.log(c)
        var e='hello'
        var f='world'
        console.log(e,f)
        var g=true
        var h=false
        console.log(g,h)
        //undefined类型,如果声明了变量没有赋值就是undefined
        var i;
        console.log(i)
        console.log(typeof c)
        console.log(typeof g)
        console.log(typeof e)
    </script>
</head>
<body>
    
</body>
</html>

我们打开页面的console也就是控制台可以看到我们定义的变量的输出。
在这里插入图片描述
和我们定义的相符合

运算符

运算和大部分的编程语言运算的方式都是一样的,这里需要注意++的先后顺序。

    <script>
        var a=1
        var b=2
        var c=1+2
        console.log(c)
        var g=4
        var h=g++
        console.log(g,h)
        var i=++g
        console.log(g,i)
        var k=1
        k=k-10
        console.log(k)
    </script>

在这里插入图片描述

Switch语句

    <script>
        var a = 1
        if (a > 0) {
            console.log('a>0')
        } else {
            console.log('a<0')
        }
        var b = 3
        switch (b) {
            case 1:
                console.log(1)
                break;
                case 2:
                console.log(2)
                break;
                case 3:
                console.log(3)
                break;
            default:
                console.log('啥也不是')
                break;

        }
    </script>

这里面的语法和之前的基本都一样,都是老生常谈了
在这里插入图片描述

定义函数

        var ArrayUtils = {
            // 对象的属性值如果是一个函数,我们称之为方法
            foreach: function (arr) {
                for (var key in arr) {
                    console.log(key, arr[key])
                }
            },

            join: function (arr, sep) {
                var str = ''
                for (var i = 0; i < arr.length; i++) {
                    if (i == arr.length - 1) {
                        str = str + arr[i]
                    } else {
                        str = str + arr[i] + sep
                    }
                }
                console.log(str)
            },
            findIndex: function (arr, num) {

                for (var i = 0; i < arr.length; i++) {
                    // console.log(arr[i])
                    if (arr[i] == num) {
                        return i
                    }
                }
                //如果循环到最后都没有和num相等的值
                return -1
            }
        }

在以后调用函数可以这么写

        var index = ArrayUtils.findIndex(numArr, 100)
        console.log('---------------------')
        console.log('其下标是' + index)

这里的findIndex是一个查找数组中有没有自己设定的数字,如果有就返回数组的下标,如果没有的话就返回-1。
我们在这里传入的是100,他返回了2,证明是数组中第三个元素

生成随机数

        var CodeUtils = {
            createCode: function (size) {
                var code = ''
                for (var i = 0; i < size; i++) {
                    var index = Math.floor(Math.random() * pool.length)
                    code += pool[index]
                }
                return code
            }

        }
        var code = CodeUtils.createCode(5)
        console.log(code)

在这里插入图片描述
每次刷新一下,数字都会变化

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/584959.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

点云配准算法综述-完整解读

点云配准的挑战 同源点云配准 同源点云的配准是指从同一类型的传感器,但在不同的时间或视角下获取的点云在进行配准问题中存在的挑战,其主要包含了 噪声和离群值。在不同的采集时间,环境和传感器噪声是不同的,采集到的点云在同一三维位置附近会包含噪声和异常值。部分重叠…

全网最火爆,从接口测试到接口自动化测试总结,卷王进阶高级...

目录&#xff1a;导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09; 前言 Python接口自动化测…

设计模式之美-为什么基于接口而非实现编程?有必要为每个类都定义接口吗?

我愿意称之为最强设计书籍之一。看完这篇文章使我对代码编写有了新的思考。值得注意的是文章全篇写的是伪代码&#xff0c;并没有真正实现方法的逻辑&#xff0c;不过这样反而有利于逻辑的理解。 在上一节课中&#xff0c;我们讲了接口和抽象类&#xff0c;以及各种编程语言是如…

如何跑通一个java项目

查找项目代码的途径&#xff1a;github,码云&#xff0c;掘金网 以小说精品屋项目(掘金网)为例&#xff1a; 先读Readme&#xff08;这里会介绍项目结构和技术选型&#xff09;&#xff0c;这里还会告诉你们怎么跑起来这个项目&#xff0c;比如让你先安装数据库&#xff0c;然…

从业者指南:专业编辑和校对技巧

在写作领域&#xff0c;编辑和校对是确保高质量作品的关键步骤。作为从业者&#xff0c;你需要掌握专业的编辑和校对技巧&#xff0c;以提高客户满意度和自己的市场竞争力。以下是一些值得关注的专业编辑和校对技巧。 1.建立良好的沟通 与客户保持良好的沟通是提高编辑和校对质…

如何更改 Linux 文件和目录权限?

在Linux系统中&#xff0c;文件和目录权限是安全性和访问控制的关键组成部分。正确设置文件和目录的权限可以确保只有授权的用户能够读取、写入或执行这些文件和目录。 本文将详细介绍如何在Linux系统中更改文件和目录的权限。 1. 文件和目录权限概述 在Linux系统中&#xff…

解决Kubernetes就绪检查导致网关不可用的问题

引言 在K8s环境中&#xff0c;由于就绪检查设置不合理的问题&#xff0c;导致出现网关不可用的情况。 本文将详细探讨这个问题的原因&#xff0c;并提供一些解决方案&#xff0c;帮助有需要的同学解决类似的问题。 注&#xff1a;网关使用 spring-cloud-gateway 问题描述 描…

记录两个Windows和Mac上部署阿里Canal无法启动的神坑

目录 一、问题列表 二、解决方案 三、参考资料 四、配置详解 五、数据库相关操作 一、问题列表 1、问题一&#xff1a;点击 startup.bat 窗口出现后立马闪退的问题。 2、问题二&#xff1a;启动后日志文件报错&#xff1a; ERROR com.alibaba.otter.canal.deployer.Cana…

办公OA系统性能分析案例

前言 信息中心老师反应&#xff0c;用户反馈办公系统有访问慢的情况&#xff0c;需要通过流量分析系统来了解系统的运行情况&#xff0c;此报告专门针对系统的性能数据做了分析。 信息中心已部署NetInside流量分析系统&#xff0c;使用流量分析系统提供实时和历史原始流量&am…

多项创新技术加持,实现零COGS的Microsoft Editor语法检查器

编者按&#xff1a;Microsoft Editor 是一款人工智能写作辅助工具&#xff0c;其中的语法检查器&#xff08;grammar checker&#xff09;功能不仅可以帮助不同水平、领域的用户在写作过程中检查语法错误&#xff0c;还可以对错误进行解释并给出正确的修改建议。神经语法检查器…

自动化测试框架的秘密,资深8年测试带你揭开,跟上测试“潮流“...

目录&#xff1a;导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09; 前言 Python自动化测试&…

携手共创开源新格局|2023开放原子全球开源峰会将于6月11日在京隆重开幕

6月11-13日&#xff0c;2023开放原子全球开源峰会将在全球数字经济大会期间召开。本次峰会将以“开源赋能&#xff0c;普惠未来”为主题&#xff0c;通过开幕式暨高峰论坛、分论坛、主题展览、开源活动周等多种形式&#xff0c;聚集政、产、学、研、用、创、投、金等各领域优势…

RPC学习笔记【一】:概述

文章目录 一、简介1.1 引言1.2 架构的演变过程 二、RPC 的设计2.1 设计目标2.2 核心问题01 通信方式02 协议03 序列化04 远程代理类 2.3 衍生方案 - 注册中心 一、简介 1.1 引言 RPC 是远程过程调用 &#xff08;Remote Procedure Call&#xff09;的缩写形式&#xff0c;是一…

一文搞懂Python时间序列预测(步骤,模板,python代码)

预测包括&#xff0c;数值拟合&#xff0c;线性回归&#xff0c;多元回归&#xff0c;时间序列&#xff0c;神经网络等等 对于单变量的时间序列预测&#xff1a;模型有AR,MA,ARMA,ARIMA&#xff0c;综合来说用ARIMA即可表示全部。 数据和代码链接&#xff1a;数据和Jupyter文…

ArcGIS10.8下载及安装教程(附安装步骤)

谷歌云&#xff1a; https://drive.google.com/drive/folders/10igu7ZSMaR0v0WD7-2W-7ADJGMUFc2ze?uspsharing ArcGIS10.8 百度网盘&#xff1a; https://pan.baidu.com/s/1s5bL3QsCP5sgcftCPxc88w 提取码&#xff1a;kw4j 阿里云&#xff1a; https://www.aliyundriv…

Linux—实操篇:远程登录到linux服务器

远程登录客户端工具有 Xshell7(远程登录)&#xff0c;Xftp7&#xff08;文件传输&#xff09;,这里介绍Xshell和Xftp&#xff0c;其他的远程工具大同小异 1、远程登录Linux—Xshell 介绍&#xff1a;Xshell是目前最好的远程登录到Linux的软件&#xff0c;流畅的速度并且完美解…

如何制作污水处理流程图?简单方式说明

污水处理是指对污水进行处理&#xff0c;以使其能够满足环境保护和人类生产生活用水的需要。污水处理流程图是整个污水处理过程的图解&#xff0c;能够直观地展现污水处理的步骤和流程。 有很多方式可以制作流程图&#xff0c;比如一些站点可以在线制作&#xff0c;还兼具了思维…

chatgpt赋能python:Python下载代码:探索更快、更简单的方式

Python下载代码&#xff1a;探索更快、更简单的方式 Python是一个功能强大的编程语言&#xff0c;可以用来开发各种应用程序&#xff0c;从Web应用程序到数据科学和机器学习。作为一个高级语言&#xff0c;它通常看起来更易于理解和编写&#xff0c;相比其他编程语言更容易维护…

现阶段检验检测认证行业到底是一个什么样的行业?

为企业创造不一样的价值&#xff01; TIC行业研究先行者、行业信息送水人&#xff01; 内容摘要 此文章重点讲述了现阶段检验检测认证行业到底是一个什么样的行业&#xff0c;以及分析这个行业好与不好的明显特点。 此文章重点分析了现阶段检验检测认证行业的驱动力、竞争格…

Socket通信讲解及C/S结构实现UDP协议通信

Sokcet 一. Socket套接字 1.1 什么是套接字 所谓套接字(Socket)&#xff0c;就是对网络中不同主机上的应用进程之间进行双向通信的端点的抽象。一个套接字就是网络上进程通信的一端&#xff0c;提供了应用层进程利用网络协议交换数据的机制&#xff0c;是支持TCP/IP协议的路通…