javaEE-11.javaScript入门

news2025/3/19 1:15:56

目录

一.什么是javaScript

二.快速实现

三.JS引入方式

1.行内引入:

 2.内部引入:

3.外部引入:

四.基础语法

1.变量

变量命名规则:

2.数据类型

3.运算符

五.JS对象

1.数组

创建数组:

2.操作数组

3.函数

函数注意事项:

函数参数:

4.对象

1.使用字面量 创建对象:

2.使用new Object()创建对象

3.使用 构造函数 创建对象


一.什么是javaScript

JavaScript(简称JS),是⼀个脚本语⾔,解释型或即时编译型的编程语⾔.

javaScript和java是不存在任何关系的.

有关javaScript的发展史:

Javascript诞生记 - 阮一峰的网络日志

JS和CSS和html的关系:

html相当于网页的骨架;

CSS相当于对网页进行填充,修饰

JS是赋予网页特有的功能,行为

二.快速实现

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        alert("hello");
    </script>
</body>
</html>

 运行浏览器:

 alert:在弹窗中显示.

三.JS引入方式

1.行内引入:

直接在html标签内使用.

 点击按钮时,弹窗显示注册成功.

 这种方式容易产生大量的冗余代码,不⽅便后期的维护,所以不常⽤.

 2.内部引入:

定义script标签,代码写在<script></script>标签中.

<script></script>标签可以放在代码任意位置,一般放在body中.

⾏内样式,只适合于写简单样式.只针对某个标签⽣效.缺点是不能写太复杂的jS.

3.外部引入:

定义script标签,通过src属性,引入外部 .js文件.

外部样式,html和js实现了完全的分离,企业开发常⽤⽅式

四.基础语法

1.变量

创建变量/声明变量/变量初始化:

        var 变量名=内容;  或 len 变量名=内容;

这两个用法差不多相同,具体区别暂不讨论.

        const 变量名=内容;

通过const创建的变量,初始化后,内容不能修改.

JS是一门动态若类型的语言:

动态:变量可以存放不同类型的值:

弱类型:随着程序的执行,变量中值的类型可以变化:

变量命名规则:

1.变量名的组成字符可以是数字,字母,下划线_,美元符$

2.数字不能开头.

3.建议使用驼峰命名法.

2.数据类型

虽然js是弱数据类型的语⾔,但是js中也存在数据类型,js中的数据类型分为:原始类型 和 引⽤类 型,具体有如下类型

数据类型描述
number数字,不区分整数和小数
string

字符串

字符串字⾯值需要使⽤引号引起来,单引号双引号均可

boolean布尔类型,true为真,false为假
undefined表示变量未初始化,只有唯⼀的值 undefined

使⽤typeof函数可以返回变量的数据类型,通过浏览器的控制台查看.

3.运算符

JS中的运算符和java中的用法基本相同

==和===的区别:

==仅用于判断内容是否相等;

===判断时 包含类型的判断.

五.JS对象

1.数组

创建数组:

1.使用new关键字创建数组:

var a = new Array();

 

2.使用字面常量创建数组:

数组中的内容称为元素.

JS中的数组元素不要求类型相同.

2.操作数组

1>.读:

通过数组下标的方式访问数组元素.

2>.增

通过数组下标新增元素,或者通过push追加元素.

可以进行隔空追加,对指定1数组下标追加.

3>.改

通过数组下标修改数组元素,

控制台输出结果:

注意

 1. 如果下标超出范围读取元素,则结果为undefined

2. 不要给数组名直接赋值,此时数组中的所有元素都没了.

3.函数

语法格式:

function 函数名(形参列表){

        函数体;

        return 返回值;

}

函数调用:

函数名(实参列表);//无返回值

var 返回值 = 函数名(实参列表);//有返回值

函数注意事项:

 函数定义并不会执⾏函数体内容,必须要调⽤才会执⾏.调⽤⼏次就会执⾏⼏次.

调⽤函数的时候进⼊函数内部执⾏,函数结束时回到调⽤位置继续执⾏.

函数的定义和调⽤的先后顺序没有要求.(这⼀点和变量不同,变量必须先定义再使⽤)

函数参数:

形参个数和实参个数可以不匹配,但是实际开发⼀般要求形参和实参个数要匹配.

1. 如果实参个数⽐形参个数多,则多出的参数不参与函数运算

1. 如果实参个数⽐形参个数少,则此时多出来的形参值为 undefined

函数表达式:

var 变量名 = function(){

        函数体;

        return 返回值;

}

此时形如 function() { } 这样的写法定义了⼀个匿名函数, 然后将这个匿名函数⽤⼀个变量来表 ⽰.  后⾯就可以通过这个 add 变量来调⽤函数了.

4.对象

js中的 数值,字符串,布尔值,数组,函数都是对象,每个对象中包含若干个属性和方法.

属性:对象的特征,

方法:对象的行为.

1.使用字面量 创建对象:

使⽤ { }创建对象

 • 属性和⽅法使⽤键值对的形式来组织.

 • 键值对之间使⽤ , 分割.最后⼀个属性后⾯的,可有可⽆

• 键和值之间使⽤ : 分割.

 • ⽅法的值是⼀个匿名函数.

使用对象的属性和方法:

2.使用new Object()创建对象

这种创建对象方法和创建数组方法类似.

3.使用 构造函数 创建对象

语法:

function 构造函数名(参数列表){

        this.属性名=值;

        this.方法名=function(){}

        .....

}

调用:

var 变量名= new 构造函数名(实参列表);

注意:

 • 在构造函数内部使⽤this关键字来表⽰当前正在构建的对象.

 • 构造函数的函数名⾸字⺟⼀般是⼤写的.

 • 构造函数的函数名可以是名词.

 • 构造函数不需要 return

 • 创建对象的时候必须使⽤ new 关键字.

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

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

相关文章

畅游Diffusion数字人(16):由音乐驱动跳舞视频生成

畅游Diffusion数字人(0):专栏文章导航 前言:从Pose到跳舞视频生成的工作非常多,但是还没有直接从音乐驱动生成的工作。最近字节跳动提出了MuseDance,无需复杂的动作引导输入(如姿势或深度序列),从而使不同专业水平的用户都能轻松进行灵活且富有创意的视频生成。 目录 贡…

DeepSeek 助力 Vue 开发:打造丝滑的步骤条

前言&#xff1a;哈喽&#xff0c;大家好&#xff0c;今天给大家分享一篇文章&#xff01;并提供具体代码帮助大家深入理解&#xff0c;彻底掌握&#xff01;创作不易&#xff0c;如果能帮助到大家或者给大家一些灵感和启发&#xff0c;欢迎收藏关注哦 &#x1f495; 目录 Deep…

领略算法真谛:差分

嘿&#xff0c;各位技术潮人&#xff01;好久不见甚是想念。生活就像一场奇妙冒险&#xff0c;而编程就是那把超酷的万能钥匙。此刻&#xff0c;阳光洒在键盘上&#xff0c;灵感在指尖跳跃&#xff0c;让我们抛开一切束缚&#xff0c;给平淡日子加点料&#xff0c;注入满满的pa…

【图片转换PDF】多个文件夹里图片逐个批量转换成多个pdf软件,子文件夹单独合并转换,子文件夹单独批量转换,基于Py的解决方案

建筑设计公司在项目执行过程中&#xff0c;会产生大量的设计图纸、效果图、实景照片等图片资料。这些资料按照项目名称、阶段、专业等维度存放在多个文件夹和子文件夹中。 操作需求&#xff1a;为了方便内部管理和向客户交付完整的设计方案&#xff0c;公司需要将每个项目文件…

在Linux上如何让ollama在GPU上运行模型

之前一直在 Mac 上使用 ollama 所以没注意&#xff0c;最近在 Ubuntu 上运行发现一直在 CPU 上跑。我一开始以为是超显存了&#xff0c;因为 Mac 上如果超内存的话&#xff0c;那么就只用 CPU&#xff0c;但是我发现 Llama3.2 3B 只占用 3GB&#xff0c;这远没有超。看了一下命…

程序诗篇里的灵动笔触:指针绘就数据的梦幻蓝图<8>

大家好啊&#xff0c;我是小象٩(๑ω๑)۶ 我的博客&#xff1a;Xiao Xiangζั͡ޓއއ 很高兴见到大家&#xff0c;希望能够和大家一起交流学习&#xff0c;共同进步。 今天我们复习前面学习的指针知识 目录 关于指针数组和数组指针的区别指针数组&#xff08;Array of Poi…

快速集成DeepSeek到项目

DeepSeek API-KEY 获取 登录DeekSeek 官网&#xff0c;进入API 开放平台 2. 创建API-KEY 复制API-KEY进行保存&#xff0c;后期API调用使用 项目中集成DeepSeek 这里只展示部分核心代码&#xff0c;具体请查看源码orange-ai-deepseek-biz-starter Slf4j AllArgsConstructo…

DeepSeek做赛车游戏

赛车模型 2D生成图片 任意AI图片软件SD&#xff0c;MJ 图片生成3D模型 车身 车轮 场景 Rodin,Tripo和Meshy 询问deepSeek如何开发 拷贝代码 将汽车运行代码拖到汽车上 再让AI写个摄像头跟随代码 再去提问deepseek控制轮胎和一些处理细节

未来替代手机的产品,而非手机的本身

替代手机的产品包括以下几种&#xff1a; 可穿戴设备&#xff1a;智能手表、智能眼镜等可穿戴设备可以提供类似手机的功能&#xff0c;如通话、信息推送、浏览网页等。 虚拟现实&#xff08;VR&#xff09;技术&#xff1a;通过佩戴VR头显&#xff0c;用户可以进行语音通话、发…

uniapp开发微信小程序请求超时设置【亲测有效】

在Hbuilderx中 使用uniapp开发微信小程序时 封装请求方法 请求代码如下 function requestFun(app) {// get请求app.config.globalProperties._get function(path, data, success, fail, complete) {data data || {};data.token uni.getStorageSync(token) || ;uni.request…

deepseek本地部署-linux

1、官网推荐安装方法&#xff08;使用脚本&#xff0c;我绕不过github&#xff0c;未采用&#xff09; 登录ollama下载网站https://ollama.com/download/linux&#xff0c;linux下有下载脚本。 正常来说&#xff0c;在OS系统下直接执行脚本即可。 2、手动安装方法 2.1获取ol…

vite + axios 代理不起作用 404 无效

vite axios 代理不起作用 先看官方示例 export default defineConfig({server: {proxy: {// 字符串简写写法/foo: http://localhost:4567,// 选项写法/api: {target: http://jsonplaceholder.typicode.com,changeOrigin: true,rewrite: (path) > path.replace(/^\/api/, )…

【Linux】从零开始:编写你的第一个Linux进度条小程序

Linux相关知识点可以通过点击以下链接进行学习一起加油&#xff01;初识指令指令进阶权限管理yum包管理与vim编辑器GCC/G编译器make与Makefile自动化构建GDB调试器与Git版本控制工具 &#x1f308;个人主页&#xff1a;是店小二呀 &#x1f308;C语言专栏&#xff1a;C语言 &am…

【办公类-53-04】20250209Python模仿制作2024学年第二学期校历

背景需求&#xff1a; 马上开学了&#xff0c;又要制作校历&#xff08;删划节假日&#xff09;。之前我都是用网络的图片&#xff0c;然后在PPT里修改。 存在问题&#xff1a; 网络校历是从周日开始的&#xff0c;但日常我们老师做教案&#xff0c;都是默认从周一到周五&…

11vue3实战-----封装缓存工具

11vue3实战-----封装缓存工具 1.背景2.pinia的持久化思路3.以localStorage为例解决问题4.封装缓存工具 1.背景 在上一章节&#xff0c;实现登录功能时候&#xff0c;当账号密码正确&#xff0c;身份验证成功之后&#xff0c;把用户信息保存起来&#xff0c;是用的pinia。然而p…

Unity 基础编程

在这个练习中将新建unity脚本&#xff0c;控制player的运动与转动&#xff0c;实现用代码检测碰撞与删除物体。 该练习将应用附件中的项目文件&#xff0c;该文件与Unity快速练习的文件是同一个项目文件。 一、构建Player运动脚本 该部分将构建一个在场景中由玩家控制游戏物…

Spring Boot接入Deep Seek的API

1&#xff0c;首先进入deepseek的官网&#xff1a;DeepSeek | 深度求索&#xff0c;单击右上角的API开放平台。 2&#xff0c;单击API keys&#xff0c;创建一个API&#xff0c;创建完成务必复制&#xff01;&#xff01;不然关掉之后会看不看api key&#xff01;&#xff01;&…

从Word里面用VBA调用NVIDIA的免费DeepSeekR1

看上去能用而已。 选中的文字作为输入&#xff0c;运行对应的宏即可&#xff1b;会先MSGBOX提示一下&#xff0c;然后相关内容追加到word文档中。 需要自己注册生成好用的apikey Option ExplicitSub DeepSeek()Dim selectedText As StringDim apiKey As StringDim response A…

C语言学习笔记:子函数的调用实现各个位的累加和

在C语言程序学习之初&#xff0c;我们都会学习如何打印 hello world&#xff0c;在学习时我们知道了int main&#xff08;&#xff09;是主函数&#xff0c;程序从main函数开始执行&#xff0c;这是流程控制的一部分内容。在主函数中我们想要实现一些功能&#xff0c;比如求各个…

grafana面板配置opentsdb

新增面板&#xff1a; 这里add-panel: 如果不是想新增面板而是想新增一行条目&#xff0c;则点击convert to row: 在新增的面板这里可以看到选择数据源 Aggregator&#xff1a;聚合条件&#xff0c;区分下第一行和第二行的aggregator&#xff0c;第一个是对指标值的聚合&…