JavaScripts笔记I(基础)

JavaScripts基础

js是一门编程语言，可以实现很多的网页交互效果。

JavaScript脚本语言具有以下特点:

（1）脚本语言。JavaScript是一种解释型的脚本语言，C、C++等语言先编译后执行，而JavaScript是在程序的运行过程中逐行进行解释。

（2）基于对象。JavaScript是一种基于对象的脚本语言，它不仅可以创建对象，也能使用现有的对象。

（3）简单。JavaScript语言中采用的是弱类型的变量类型，对使用的数据类型未做出严格的要求，是基于Java基本语句和控制的脚本语言，其设计简单紧凑。

（4）动态性。JavaScript是一种采用事件驱动的脚本语言，它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时，鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应。

（5）跨平台性。JavaScript脚本语言不依赖于操作系统，仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用，前提是机器上的浏览器支持JavaScript脚本语言，JavaScript已被大多数的浏览器所支持。 [4]不同于服务器端脚本语言，例如PHP与ASP，JavaScript主要被作为客户端脚本语言在用户的浏览器上运行，不需要服务器的支持。所以在早期程序员比较倾向于使用JavaScript以减少对服务器的负担，而与此同时也带来另一个问题，安全性。

而随着服务器的强壮，虽然程序员更喜欢运行于服务端的脚本以保证安全，但JavaScript仍然以其跨平台、容易上手等优势大行其道。同时，有些特殊功能（如AJAX）必须依赖JavaScript在客户端进行支持。

js书写位置

  • 内部 js

​ 直接写在html中，用scripts标签包住 ，一般scripts标签写在body上面

  • 外部js

    在html文件外部创建一个js文件，然后再在html文件中通过scripts标签调用；scripts标签中无需再写代码，否则会被忽视

    <body><script src="./day01.js"></script>
</body>

  • 行内js

    代码写在标签内部 多用于vue框架

js注释

  • 单行注释
    • 符号 ：//
    • 快捷键 ctrl+/
  • 块注释
    • 符号 ：/* */
    • 快捷键：shift+alt+a

注意点：结束符号是" ; " 结束符号可以省略不写

输入输出语句

输出语句

  • 语句1

    document.write(“hello world”)

作用：向body内输出内容

  • 语句2 ***

    alert(“hello world”)

作用：页面弹出警告对话框

  • 语句3

    console.log(‘控制台打印’)

作用：控制台输出语法，程序员调试使用

输入语句

  • 语句1 ***

    prompt(‘please write you name？’)

作用：显示一个对话框，对话框中包含一条文字信息，用来提示用户输入文字

执行顺序：

  • 按html文档流顺序执行js代码
  • alert()和prompt()他们会跳过页面渲染先被执行

变量

抽象：存储数据的容器

语法：

let 变量名

let 是关键字(允许、许可、让、要)，所谓关键字就是系统提供专门用来声明变量的词语

变量赋值初始化：let num =20

注意：声明变量统一使用let

var声明变量缺点：

  • 可以先使用再声明
  • var声明过的变量可以重复声明
  • 变量提升，全局变量，没有块级作用域等等

数组

声明语法

let  array = ['a','b','c']
//同样通过下标索引获取元素

常量

概念：使用const声明的变量称为常量

使用场景：当某个变量永远不会改变的时候就可以使用const来声明，而不是使用let

命名规范和变量一致

常量使用：

声明：

const G = 10010
console.log(G)

注意：常量不允许重新赋值 ，声明常量的时候必须初始化(赋值)

不需要重新赋值的数据可以使用常量const

数据类型

js是弱类型语言，变量属于哪种数据类型，只有赋值之后我们才能确认；

不同于java强类型语言

  • 基本数据类型

    • Number 数字型

      • 整数、小数、负数、正数

        let age = 18 //整数
let num = 3.14 //小数

      • 算数运算符 与java相同

      • NaN

        • 代表计算错误，它是一个不正确或者一个未定义的数学操作所得到的结果。 NaN是粘性的，任何对NaN的操作都会返回NaN。

          console.log("你好" - 2) //返回NaN
console.log(NaN - 2) //返回NaN

    • String 字符串型

      • 在js中 无论是 单引号、双引号、反引号 包裹的数据都叫字符串

      • 字符串拼接一样使用+号

      • 模板字符串

        • 使用场景：

          • 拼接字符串和变量

          • 拼接变量较多比较麻烦

          • 语法：

            • 字符串使用反引号包裹
            • 变量使用${变量}
            let age =18
document.write(`今年我${age}岁了`)

    • boolean 布尔型

      • 表示肯定或者否定时在计算机中对应的是布尔类型，他只有两个固定的值true和flase，表示真或者假

    • undefined 未定义型

      • 比较特殊的类型 只有一个值undefined

      • 只声明变量，不赋值的情况下，变量的默认值为undefined，一般很少直接为某个变量赋值为undefined

        let age //为声明变量
document.write('age') //输出undefined

    • null 空类型

      • js中的null 仅表示一个代表"无"、”空“、”值未知“的特殊值

      • null 一般作为尚未创建的对象

        let age =null 
console.log(age) //输出结果为null
typeof  age //输出结果的数据类型为对象

  • 引用数据类型

    • object 对象

  • 通过typeof关键字可以检测数据类型

    1. 作为运算符 typeof age
    2. 函数形式 typeof(age)

    一般都是用第一种形式

类型准换

JavaScript是一种动态类型的编程语言，它的变量不需要在声明时指定类型，可以根据变量的值自动推断类型。JavaScript中有许多数据类型，包括基本数据类型和复杂数据类型。

通俗的来讲：就是把一种数据类型的变量转换成我们所需要的数据类型

隐式转换

JS中的隐式转换指的是在进行运算或比较时自动将数据类型从原始值（如字符串、布尔值等）转换为其他数据类型。而显式转换则需要通过特定的函数来手动进行转换。

以下是常用的隐式转换示例及对应的结果：

  1. 当两个不同类型的操作数相加时，会先将其中一个操作数转换成与另一个操作数相同的类型再进行计算。

    示例：let result = "5" + 3; // 输出结果为 “53”

  2. 当使用乘法运算符 * 连接两个字符串时，会将第二个操作数视为重复次数并返回新的字符串。

    示例：let result = "hello" * 3; // 输出结果为 “hellohellohello”

  3. 当使用关系运算符 <, >, <=, >=, ==, !=, ===, !== 进行比较时，会根据操作数的类型进行隐式转换后再进行比较。

    示例：console.log(true == 1); // 输出结果为 true

  4. 当调用内置函数 parseInt() 或 parseFloat() 时，可以将字符串转换为整数或浮点数。

    示例：let numStr = "10"; let numInt = parseInt(numStr); console.log(typeof numInt); // 输出结果为 number

  • 规则：
    • +号两边只要有一个是string，都会把另一个数据转换成string类型
    • 除了+以外的算术运算符 比如 - * / 等都会把数据转换成数字类型

注意当当+号作为正号是会将数据转换成数字类型

//+号做拼接
console.log("2"+"2") //输出为22
//+号做正号 加号
console.log(2+"2") //输出为22
console.log(+"2"+"2") //输出为22

缺点是转换类型不明确

显式转换

以下是常用的显式转换示例及对应的结果：

  1. 使用全局函数 Number() 将任意类型的变量转换为数字类型。

    示例：let strNum = "10"; let num = Number(strNum); // 输出结果为 10 (number)

  2. 使用全局函数 String() 将任意类型的变量转换为字符串类型。

    示例：let boolValue = false; let strBool = String(boolValue); // 输出结果为 “false” (string)

  3. 使用全局函数 Boolean() 将任意类型的变量转换为布尔类型。

    示例：let zero = 0; let isZero = Boolean(zero); // 输出结果为 false (boolean)

例如转换成数字类型

  • Number(数据)
    • 如果转换时String中有非数字，转换失败时显示结果为NaN即不是一个数字
    • NaN也是Number类型的数据，代表非数字
  • parselnt(数据)
    • 只保留整数
  • parseFloat(数据)
    • 保留整数和小数

自增运算符

前置先加再用 、后置先用再加

let i= 1 
console.log(++i + 2 ) //输出结果为4  i先加1再计算
console.log(i++ + 2 ) //输出结果为3  i先参与计算BUT 在独立使用的时候两者结果并灭有区别

比较运算符

js中需要注意的比较运算符：

  • ==： 左右两边值是否相等

  • ===： 左右两边时候类型和值都相等

在js开发中比较是否相等推荐使用 ===：

同样比较String 比较的是其对应的ASCII码

运算符比较级

优先级运算符顺序
1小括号()
2一元运算符++ – !
3算数运算符* / = -
4关系运算符> >= < <=
5相等运算符== != === !===
6逻辑运算符&& ||
7赋值运算符=
8逗号运算符,

一元运算符中！优先级很高

分支语句

  • if
  • 三元运算符
  • switch

if分支语句

  • if单分支
<script>//注意这边类型转换我们可以直接在前面写一个+号// let score = +( prompt("please you score？"))let score=Number( prompt("please you score？"))if (score >= 700) {alert("you score >= 700")}
</script>
  • 双分支语句
<script>//注意这边类型转换我们可以直接在前面写一个+号// let score = +( prompt("please you score？"))let score=Number( prompt("please you score？"))if (score >= 700) {alert("you score >= 700")}else {alert("you scoer <700 ")}
</script>
  • 多分支语句
<script>//注意这边类型转换我们可以直接在前面写一个+号// let score = +( prompt("please you score？"))let score=Number( prompt("please you score？"))if (score >= 90) {alert("you score is 优秀)}else if(score >=80) {alert("you score is 良好")}else if(score>=70) {alert("you score is 中等")}else {alert("you scoer 及格 ")}
</script>

三元运算符

语法：

条件 ?  满足条件时执行的代码 : 不满足条件时执行的代码

console.log(3>5?3:5) //返回值为5

数字补0案例

    let num =+("please print number")num =num <10 ? 0+num:numalert(num)

switch分支语句

语法：

    switch(sp){case '+':alert(num1+num2)breakcase '-':alert(num1-num2)breakcase '*':alert(num1*num2)breakcase '/':alert(num1/num2)breakdefault:alert(`恁不输入加减乘除恁弄啥嘞`)}
//注意switch 需要配合break使用 不然会造成switch穿透

While循环

基本语法：

打印10遍abc

let i = 0 
while (i<10){document.write("abc <br>")i++
}

循环的退出

break 和continue 与java中作用相同

for循环

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

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

macOS - md5 | md5sum

macOS - md5 | md5sum

文章目录 简单使用介绍文档Linux - md5summacOS - md5 大文件传输是否完整&#xff0c;你可以使用 md5 进行校验 linux 上使用 md5sum 命令&#xff0c;在macOS 上 md5 命令是和 md5sum 等效的 简单使用介绍 参考&#xff1a;https://blog.csdn.net/cnds123321/article/detail…
阅读更多...
[go语言]数据类型

[go语言]数据类型

目录 知识结构 整型、浮点型 1.整型 2.浮点型 复数、布尔类型 1.复数 2.布尔类型 字符与字符串 1.字符串的格式化 2.字符串的截取 3.格式化好的字符串赋值给量 4.字符串的转换 5.strings包 知识结构 整型、浮点型 1.整型 在Go语言中&#xff0c;整型数据是一种基…
阅读更多...
计算机基础之输入设备，输出设备及中央处理器

计算机基础之输入设备，输出设备及中央处理器

输入、输出设备和中央处理器 输入设备 输入设备用于接收用户输入的命令、程序、图像和视频等&#xff0c;专门负责将现实中的信息转换成计算机能识别的二进制编码&#xff0c;并放入内存。是计算机与用户或其他设备通信的桥梁。 常用的输入设备&#xff1a; 键盘&#xff1…
阅读更多...
MySQL三大日志

MySQL三大日志

1. redo log 1.1 特点 InnoDB存储引擎独有物理日志&#xff0c;记录在数据页上做的修改让MySQL拥有了崩溃恢复能力&#xff0c;保证事务的持久性 1.2 刷盘时机 事务提交时log buffer 空间使用大约一半时事务日志缓冲区满InnoDB 定期执行检查点Checkpoint后台刷新线程&#…
阅读更多...
短视频代运营抖音项目规划管理计划模板

短视频代运营抖音项目规划管理计划模板

【干货资料持续更新&#xff0c;以防走丢】 短视频代运营抖音项目规划管理计划模板 部分资料预览 资料部分是网络整理&#xff0c;仅供学习参考。 短视频代运营模板&#xff08;完整资料包含以下内容&#xff09; 目录 具体的表格设计和内容可能因不同的情况和需求而有所变…
阅读更多...
移动端开发进阶之蓝牙通讯（四）

移动端开发进阶之蓝牙通讯（四）

移动端开发进阶之蓝牙通讯（四） 在移动端开发实践中，可能会要求在不同的设备之间切换，从而提升用户体验； 或者为了提升设备的利用率，实现设备之间的连接和协同工作； 不得不通过多端连接，将多个设备连接在一起，实现设备之间的数据共享、远程控制等功能，根据具体的应用…
阅读更多...
STC8H8K蓝牙智能巡线小车——1. 环境搭建（基于RTX51操作系统）

STC8H8K蓝牙智能巡线小车——1. 环境搭建（基于RTX51操作系统）

1. 基本介绍 开发环境准备&#xff1a;Keil uVision5 烧录软件&#xff1a;STC-ISP&#xff08;V6.92A&#xff09; 芯片&#xff1a; STC8H8K64U-45I-LQFP64 芯片引脚&#xff1a; 2.创建项目 打开Keil&#xff0c;点击【Project】&#xff0c;选择【new uVersion proje…
阅读更多...
LeetCode刷题16:滑动窗口解决209. 长度最小的子数组

LeetCode刷题16:滑动窗口解决209. 长度最小的子数组

题目陈述&#xff1a; 给定一个含有 n 个正整数的数组和一个正整数 target 。 找出该数组中满足其总和大于等于 target 的长度最小的 连续子数组 [numsl, numsl1, ..., numsr-1, numsr] &#xff0c;并返回其长度。如果不存在符合条件的子数组&#xff0c;返回 0 。 示例 1&a…
阅读更多...
RPM命令详解2---查询验证

RPM命令详解2---查询验证

一、RPM查询 rpm {-q|–query} [select-options] [query-options] select-options [PACKAGE_NAME] [-a,–all] [-f,–file FILE] [-g,–group GROUP] {-p,–package PACKAGE_FILE] [–hdrid SHA1] [–pkgid MD5] [–tid TID] [–querybynumber HDRNUM] [–triggeredby PACKAGE…
阅读更多...
【控制篇 / 分流】(7.4) ❀ 03. 对国内和国际IP网段访问进行分流 ❀ FortiGate 防火墙

【控制篇 / 分流】(7.4) ❀ 03. 对国内和国际IP网段访问进行分流 ❀ FortiGate 防火墙

【简介】公司有两条宽带用来上网&#xff0c;一条电信&#xff0c;一条IPLS国际专线&#xff0c;由于IPLS仅有2M&#xff0c;且价格昂贵&#xff0c;领导要求&#xff0c;访问国内IP走电信&#xff0c;国际IP走IPLS&#xff0c;那么应该怎么做&#xff1f; 国内IP地址组 我们已…
阅读更多...
Spring之BeanDefinition

Spring之BeanDefinition

BeanDefinition BeanDefinition表示Bean定义&#xff0c;BeanDefinition中存在很多属性用来描述一个Bean的特点。 比如&#xff1a; - class&#xff0c;表示Bean类型 - scope&#xff0c;表示Bean作用域&#xff0c;单例或原型等 - lazyInit&#xff1a;表示Bean是否是懒加载…
阅读更多...
JavaScript之判断是否整数、取余、取整、进制、位或、ES6

JavaScript之判断是否整数、取余、取整、进制、位或、ES6

MENU 方法一方式二方式三方式四方式五结束语 方法一 使用取余运算符判断&#xff0c;利用任何整数都会被1整除的原理&#xff0c;即余数是0的特点&#xff0c;通过这个规则来判断是否是整数。 let isInteger (val) > val % 1 0;// true isInteger(5); // false isInteger(…
阅读更多...
ERP办公系统如何选择阿里云服务器？

ERP办公系统如何选择阿里云服务器？

公司OA、ERP等办公系统如何选择阿里云服务器配置&#xff1f;可以选择第七代企业级独享型云服务器&#xff0c;ECS通用型g7、计算型c7或内存型r7实例&#xff0c;4核CPU8G内存、8核16G、4核16G等配置&#xff0c;活动 https://t.aliyun.com/U/bLynLC 实例规格使用场景vCPU内存…
阅读更多...
深度学习(2)--卷积神经网络(CNN)

深度学习(2)--卷积神经网络(CNN)

卷积神经网络&#xff08;Convolutional Neural Networks&#xff09;是一种深度学习模型或类似于人工神经网络的多层感知器&#xff0c;常用来分析视觉图像。 一.卷积网络基础概念 传统网络是一维的&#xff0c;而卷积网络是三维的。 例如32x32x3的图片&#xff0c;在传统网…
阅读更多...
滑动窗口经典入门题-——长度最小子数组

滑动窗口经典入门题-——长度最小子数组

文章目录 算法原理题目解析暴力枚举法的代码优化第一步初始化第二步right右移第三步left右移 滑动窗口法的代码 算法原理 滑动窗口是一种在序列&#xff08;例如数组或链表&#xff09;上解决问题的算法模式。它通常用于解决子数组或子字符串的问题&#xff0c;其中滑动窗口表示…
阅读更多...
C#： form 窗体的各种操作

C#： form 窗体的各种操作

说明&#xff1a;记录 C# form 窗体的各种操作 1. C# form 窗体居中显示 // 获取屏幕的宽度和高度 int screenWidth Screen.PrimaryScreen.Bounds.Width; int screenHeight Screen.PrimaryScreen.Bounds.Height;// 设置窗体的位置 this.StartPosition FormStartPosition.M…
阅读更多...
2024.1.17每日一题

2024.1.17每日一题

LeetCode 2744.最大字符串配对数目 2744. 最大字符串配对数目 - 力扣&#xff08;LeetCode&#xff09; 题目描述 给你一个下标从 0 开始的数组 words &#xff0c;数组中包含 互不相同 的字符串。 如果字符串 words[i] 与字符串 words[j] 满足以下条件&#xff0c;我们称…
阅读更多...
【ubuntu】docker中如何ping其他ip或外网

【ubuntu】docker中如何ping其他ip或外网

docker中如何ping其他ip或外网 示例图&#xff1a; 运行下面命令&#xff1a; docker run -it --namehei busybox看情况需要加权限 sudo&#xff0c;即&#xff1a; sudo docker run -it --namehei busyboxping 外网 ping -c 4 www.baidu.comping 内网 ping -c 4 192.168.…
阅读更多...
【多线程】认识Thread类及其常用方法

【多线程】认识Thread类及其常用方法

&#x1f4c4;前言&#xff1a; 本文是对以往多线程学习中 Thread类 的介绍&#xff0c;以及对其中的部分细节问题进行总结。 文章目录 一. 线程的 创建和启动&#x1f346;1. 通过继承 Thread 类创建线程&#x1f345;2. 通过实现 Runnable 接口创建线程&#x1f966;3. 其他方…
阅读更多...
java转义字符

java转义字符

//转义字符的使用 public class ChangeChar{//编写一个main方法public static void main(String[] args){// \t :一个制表位&#xff0c;实现对齐的功能System.out.println("北京\t天津\t上海");// \n :换行符&#xff0c;实现换行System.out.println("jack\nsm…
阅读更多...
最新文章

Copyright @ 2022~2023