JavaScript(JS)

news2025/1/13 2:35:33

一、三种引入方式:

1、内部js  通过script标签嵌入到html里面

 <script>
        alert('hello');
 </script>

2、外部js  写成一个单独的.js文件,让html引入进来

 <script src="app.js"></script>

3、行内js  直接写到html内部

<div onclick="alert('hello')">这是一个div,点我试试</div>

alert:能够弹出对话框 ,从而让用户看到程序的输入。但有些对话框弹出时会阻止用户操作界面的其他部分,叫模态对话框。

console.log:在控制台中打印日志   js中的console.log类似于java中的println,是非常有用的调试手段

二、关于js的变量

let 变量名 = 值;

 <script>
    let a = 10;
    console.log(a);
    let b = 'hello';
    console.log(b);
 </script>

三、JS 动态类型

  <script>
    let a = 10;
    console.log(a);
    a = 'hello';
    console.log(a);
  </script>

动态类型:一个变量在程序运行过程中,类型可以发生改变,如:JS、Python、PHP、Lua

静态类型:一个变量在程序运行过程中,类型不可以发生改变,如:C、Java、C++、Go

四、数组

 JS中使用 [ ] 来表示数组,数组的元素类型不要求统一,可以是任意类型

 let arr = [1,'hello',true,[]];

操作数组元素:访问下标

  <script>
    let arr = [1,'hello',true,[]];
    console.log(arr[0]);
    console.log(arr[1]);
    console.log(arr[2]);
    console.log(arr[3]);
    console.log(arr);
    arr[3] = '哈哈';
    console.log(arr);
  </script>

数组遍历:

    let arr = [1,'hello',true,];

    for (let i = 0; i < arr.length; i++) {
        console.log(arr[i]);
    }

    for (let i in arr){
        //此处的 i 是数组下标
        console.log(arr[i]);
    }

    for (let elem of arr){
        //此处的 elem 是数组元素
        console.log(elem);
    }

给数组添加元素(尾插):使用 push 方法

arr.push('feidu');

删除元素:使用 splice 方法      此方法可以用来插入修改删除

splice(startIndex,count,变长参数)     会把后面变长参数的内容,替换到前面的指定区间之内

如果后面没有变长参数,相当于删除

如果后面变长参数和前面指定的区间个数(count)一样,此时就是修改/替换

如果后面变长参数比前面的去见个数(count)长,此时就是修改加插入

    let arr = [1,'hello',true,];
    arr.push('feidu');
    console.log(arr);
    //删除
    arr.splice(2,1);
    console.log(arr);
    //替换
    arr.splice(1,1,'zhou')
    console.log(arr);
    //修改+插入
    arr.splice(1,1,'haha','hehe')
    console.log(arr);

五、函数

function 函数名(形参列表) {    

函数体    

return 返回值;

function add(x,y){
        return x+y;
}
console.log(add(10,20));
console.log(add('hello','world'));
    function add(){
        let result = 0;
        for (let elem of arguments){
            result += elem;
        }
        return result;
    }
    console.log(add(10));
    console.log(add(10,20));
    console.log(add(10,20,30));
    console.log(add(10,'hello'));

函数表达式

 六、 对象

    let student = {
        name: 'hh',
        age: 25,
        height: 180,
        sing: function(){
            console.log('hahahahaha');
        },
        dance: function(){
            console.log('wawawa');
        }
    };
    console.log(student.name);
    student.sing();

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

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

相关文章

Python爬虫——使用socket模块进行图片下载

Python爬虫——使用socket模块进行图片下载什么是socket爬虫的工作流程socket爬取图片为什么能用socket能下载图片socket下载图片和request下载图片的区别使用socket下载一张图片使用socket下载多张图片方法1方法2什么是socket Socket 是一种通信机制&#xff0c;用于实现网络…

AQS为什么用双向链表?

首先&#xff0c;在AQS中&#xff0c;等待队列是通过Node类来表示的&#xff0c;每个Node节点包含了等待线程的信息以及等待状态。下面是Node类的部分源码&#xff1a;static final class Node {// 等待状态volatile int waitStatus;// 前驱节点volatile Node prev;// 后继节点…

【AI绘图学习笔记】深度学习相关数学原理总结(持续更新)

如题&#xff0c;这是一篇深度学习相关数学原理总结文&#xff0c;由于深度学习中涉及到较多的概率论知识&#xff08;包括随机过程&#xff0c;信息论&#xff0c;概率与统计啥啥啥的)&#xff0c;而笔者概率知识储备属实不行&#xff0c;因此特意开一章来总结&#xff08;大部…

Jackson CVE-2017-17485 反序列化漏洞

0x00 前言 同CVE-2017-15095一样&#xff0c;是CVE-2017-7525黑名单绕过的漏洞&#xff0c;主要还是看一下绕过的调用链利用方式。 可以先看&#xff1a; Jackson 反序列化漏洞原理 或者直接看总结也可以&#xff1a; Jackson总结 涉及版本&#xff1a;2.8.10和2.9.x至2.…

leetcode_贪心算法

贪心算法相关题简单题目455.分发饼干1005.K次取反后最大化的数组和860.柠檬水找零序列问题376.摆动序列法一&#xff1a;贪心法法二&#xff1a;动态规划单调递增的数字简化版本有点难度53.最大子序和贪心算法动态规划134.加油站968.监控二叉树两个维度权衡问题分发糖果406.根据…

MATLAB——系统环境

MATLAB概述MATLAB的发展MATLAB:MATrix LABoratory1980年前后&#xff0c;Cleve Moler教授编写的Linpack 和Eispack的接口程序。1984年&#xff0c;MATLAB第1版(DOS版)1992年&#xff0c;MATLAB4.0版1994年&#xff0c;MATLAB 4.2版1997年&#xff0c;MATLAB 5.0版1999年&#x…

12-Trie树

Trie树&#xff08;又称字典树、单词查找树&#xff09;是一种树型的数据结构&#xff0c;常用于保存和查找字符串&#xff0c;是一种十分高效率的存储和检索方式。 Trie树原理 我们先假设有六个字符串需要存储&#xff1a;abc、abcd、abef、cfgh、bc、bcd。Trie树的存储原理…

Scala04 方法与函数

Scala04 方法与函数 Scala 中的也有方法和函数的概念。 Scala中的 方法 是类的一部分。 Scala中的 函数 是一个对象&#xff0c;可以赋值给变量。 在类中定义的函数就是方法 4.1 方法 Scala 中方法 与 Java 中类似&#xff0c;是组成类的一部分 4.1.1 语法结构 格式&#x…

数据库“啃”不动?CnosDB带你轻松阅读十万行源码!

最近一直有社区的小伙伴问&#xff0c;我们很感兴趣CnosDB&#xff0c;但从何开始阅读CnosDB的代码呢&#xff0c;其实这个问题在之前的CnosDB HiTea直播时就有聊到&#xff0c;今天我们就再来回顾一下。CnosDB的源代码主要分为Query Engine和Storage Engine。Query Engine在qu…

JOSN数据转换和解析

文章目录JOSN数据转换和解析内容回顾Map 集合转成 JSON 字符串List 集合转换成 JSON 字符串Ajax 异步和同步异步概念同步概念异步和同步区别异步请求案例同步请求时间格式化旧时间 api 格式化格式化和解析的工具类JSTL 时间格式化JSTL 使用JOSN数据转换和解析 内容回顾 ajax …

指针的进阶续(笔试题强化练习)

写在前面&#xff1a;在上次我们学习了指针的相关类型的知识&#xff0c;对指针家族的成员基本有了了解&#xff0c;这次让我们跟着一些题目来练习和补充一些知识&#xff0c;这有助于我们强化理解这些知识。 话不多说&#xff0c;我们马上开始&#xff1a; 1.指针和数组的笔…

Vue基础学习 第一个Vue程序 el挂载点 v-指令(1)

Vue简介 Vue是一个Javascript框架Vue框架可以简化Dom操作响应式数据驱动 &#xff1a; 页面是由数据生成的&#xff0c;当数据出现改动&#xff0c;页面也会即时改变 第一个Vue程序 Vue中文文档官网&#xff1a;https://v2.cn.vuejs.org/v2/guide/ 根据官方文档的说法&#…

缓存与数据库的双写一致性

背景 在高并发的业务场景下&#xff0c;系统的性能瓶颈往往是出现在数据库上&#xff0c;用户并发访问过大&#xff0c;压力都打到数据库上。所以一般都会用redis做缓存层&#xff0c;起到一个缓冲作用&#xff0c;让请求先访问到缓存层&#xff0c;而不是直接去访问数据库&am…

Web3D发展趋势以及Web3D应用场景

1&#xff0c;Web3D发展趋势随着互联网的快速发展&#xff0c;Web3D技术也日渐成熟&#xff0c;未来发展趋势也值得关注。以下是Web3D未来发展趋势的七个方面&#xff1a;可视化和可交互性的增强&#xff1a;Web3D可以为三维数据提供可视化和可交互性的增强&#xff0c;将极大地…

CCNP350-401学习笔记(补充题目101-186)

101、 enable the https service 102、fabric edge node 103、 104、 105、 16113 106、filter access-group 10 107、 108、VETP 109、 110、 111、the server and the database can inititate communication 112、 113、 114、 115、 116、WAN edge&#xf…

【教程】去水印开源工具Lama Cleaner在Windows的安装和使用

一、Lama Cleaner是什么&#xff1f; Lama Cleaner是一款开源且免费的人工学习图片去水印程序&#xff08;个人主要学习用途&#xff09;&#xff0c;没有图片分辨率限制&#xff08;个人使用暂未发现&#xff09;&#xff0c;并且保存的图片质量很高&#xff08;个人觉得跟原…

MSTP多进程讲解与实验配置

目录 MSTP多进程 专业术语 MSTP多进程配置 在MSTP域配置 MSTP多进程 多进程的作用 将设备上的端口绑定到不同的进程中&#xff0c;以进程为单位进行MSTP计算&#xff0c;不在同一进程内的端口不参与此进程中的MSTP协议计算&#xff0c;实现各个进程之间的生成树计算相互独立…

【算法】DFS与BFS

作者&#xff1a;指针不指南吗 专栏&#xff1a;算法篇 &#x1f43e;题目的模拟很重要&#xff01;&#xff01;&#x1f43e; 文章目录1.区别2.DFS2.1 排列数字2.2 n-皇后问题3.BFS3.1走迷宫1.区别 搜索类型数据结构空间用途过程DFSstackO( n )不能用于最短路搜索到最深处&a…

leetcode打卡-深度优先遍历和广度优先遍历

200.岛屿数量 leetcode题目链接&#xff1a;https://leetcode.cn/problems/number-of-islands leetcode AC记录&#xff1a; 思路&#xff1a;深度优先遍历&#xff0c;从0&#xff0c;0开始遍历数组&#xff0c;使用boolean类型数组used记录是否被访问过&#xff0c;进行一…

28个案例问题分析---014课程推送页面逻辑整理--vue

一&#xff1a;背景介绍 项目开发过程中&#xff0c;前端出现以下几类问题&#xff1a; 代码结构混乱代码逻辑不清晰页面细节问题 二&#xff1a;问题分析 代码结构混乱问题 <template><top/><div style"position: absolute;top: 10px"><C…