JavaScript-2-菜鸟教程

字符串

可以使用 索引 位置访问字符串中的每个字符

可以使用内置属性 length 来计算字符串的长度

var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var sln = txt.length;

    <script>var x = "John";              // x是一个字符串// 使用 new 关键字将字符串定义为一个对象var y = new String("John");  // y是一个对象document.write(x + ' | ' + y)       // John | Johndocument.write('<br>')              // string | objectdocument.write(typeof x + ' | ' + typeof y)</script>

    <p id="demo"></p><script>var x = "John";              // x 是字符串var y = new String("John");  // y 是一个对象document.getElementById("demo").innerHTML = x === y;</script><p>=== 为绝对相等，即数据类型与值都必须相等。</p>

特殊字符

代码输出
\’单引号
\"双引号
\\反斜杠
\n换行
\r回车
\ttab(制表符)
\b退格符
\f换页符

字符串属性

属性描述
constructor返回创建字符串属性的函数
length 返回字符串的长度
prototype允许您向对象添加属性和方法

字符串方法

方法描述
charAt()返回指定索引位置的字符
charCodeAt()返回指定索引位置字符的 Unicode 值
concat()连接两个或多个字符串，返回连接后的字符串
fromCharCode()将 Unicode 转换为字符串
indexOf()返回字符串中检索指定字符第一次出现的位置
lastIndexOf()返回字符串中检索指定字符最后一次出现的位置
localeCompare()用本地特定的顺序来比较两个字符串
match()找到一个或多个正则表达式的匹配
replace()替换与正则表达式匹配的子串
search()检索与正则表达式相匹配的值
slice()提取字符串的片断，并在新的字符串中返回被提取的部分
split()把字符串分割为子字符串数组
substr()从起始索引号提取字符串中指定数目的字符
substring()提取字符串中两个指定的索引号之间的字符
toLocaleLowerCase()根据主机的语言环境把字符串转换为小写，只有几种语言（如土耳其语）具有地方特有的大小写映射
toLocaleUpperCase()根据主机的语言环境把字符串转换为大写，只有几种语言（如土耳其语）具有地方特有的大小写映射
toLowerCase()把字符串转换为小写
toString()返回字符串对象值
toUpperCase()把字符串转换为大写
trim()移除字符串首尾空白
valueOf()返回某个字符串对象的原始值

模板字符串

JavaScript 中的模板字符串是一种方便的字符串语法，允许你在字符串中嵌入表达式和变量
模板字符串使用反引号 `` 作为字符串的定界符分隔的字面量
模板字面量是用反引号（`）分隔的字面量，允许多行字符串、带嵌入表达式的字符串插值和一种叫带标签的模板的特殊结构

不使用转义符可以直接显示 引号

    <p id="demo"></p><script>let text = `He's often called "Runoob"`;document.getElementById("demo").innerHTML = text;</script>

He’s often called “Runoob”

可支持多行输入，行与行之间插入一个空格

    <script>const multiLineText = `This isa multi-linetext.`;document.write(multiLineText);</script>

This is a multi-line text.

占位符

    <p id="demo"></p><script>const name = 'Runoob';const age = 30;const message = `My name is ${name} and I'm ${age} years old.`;document.getElementById("demo").innerHTML = message;</script>

My name is Runoob and I’m 30 years old.

    <script>let price = 10;let VAT = 0.25;// toFixed 将一个浮点数转换为指定小数位数的字符串let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;document.write(total);</script>

Total: 12.50

    <script>let header = "";let tags = ["RUNOOB", "GOOGLE", "TAOBAO"];let html = `<h2>${header}</h2><ul>`;for (const x of tags) {html += `<li>${x}</li>`;}html += `</ul>`;document.write(html)</script>

在这里插入图片描述

运算符

运算符举例
% 取余5 % 2 = 1
++ 自增y = 5, x = ++y → x=6，y=6
y = 5, x = y++ → x=5，y=6
-- 自减y = 5, x = --y → x=4，y=4
y = 5, x = y-- → x=5，y=4

不论是y++ ++y y-- --y ，y本身的值都会改变

数字与字符串相加，返回字符串

比较 和 逻辑运算符

比较和逻辑运算符用于测试 true 或者 false

比较运算符

x = 5

运算符描述比较返回值
==等于x==8false
===绝对等于（值和类型均相等）x===“5”
x===5		false
true
!=不等于x!=8true
!==不绝对等于（值和类型有一个不相等，或两个都不相等）x!==“5”
x!==5		true
false
>大于x>8false
<小于x<8true
>=大于或等于x>=8false
<=小于或等于x<=8true

if (age<18) x=“Too young”;

逻辑运算符

x = 6 ，y = 3

运算符描述例子
&&and(x < 10 && y > 1) 为 true
||or(x == 5 || y==5) 为 false
!not!(x==y) 为 true

variablename=(condition)?value1:value2

    <p>点击按钮检测年龄。</p>年龄:<input id="age" value="18" /><p>是否达到投票年龄?</p><button onclick="myFunction()">点击按钮</button><p id="demo"></p><script>function myFunction() {var age, voteable;age = document.getElementById("age").value;voteable = (age < 18) ? "年龄太小" : "年龄已达到";document.getElementById("demo").innerHTML = voteable;}</script>

在这里插入图片描述

if 条件语句

    <p>点击这个按钮，获得基于时间的问候。</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction() {var x = "";var time = new Date().getHours();if (time < 20) {x = "Good day";}else {x = "Good evening";}document.getElementById("demo").innerHTML = x;}</script>

    <script type="text/javascript">var d = new Date();var time = d.getHours();if (time < 10) {document.write("<b>早上好</b>");}else if (time >= 10 && time < 20) {document.write("<b>今天好</b>");}else {document.write("<b>晚上好!</b>");}</script>

switch 条件语句

选择要执行的多个代码块之一

break 阻止代码自动地向下一个 case 运行
default 关键词 规定匹配不存在时做的事情

    <p>点击下面的按钮，会显示出基于今日日期的消息：</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction() {var x;var d = new Date().getDay();switch (d) {case 6: x = "今天是星期六";break;case 0: x = "今天是星期日";break;default:x = "期待周末";}document.getElementById("demo").innerHTML = x;}</script>

注意 Sunday=0, Monday=1, Tuesday=2, 等等

for 循环

for 循环的用法

for (语句 1; 语句 2; 语句 3)
{
被执行的代码块
}

    <script>cars = ["BMW", "Volvo", "Saab", "Ford"];for (var i = 0; i < cars.length; i++) {document.write(cars[i] + "<br>");}</script>

    <p>点击按钮循环代码5次。</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction() {var x = "";for (var i = 0; i < 5; i++) {// 累加x = x + "该数字为 " + i + "<br>";}document.getElementById("demo").innerHTML = x;}</script>

在这里插入图片描述
可以同时声明多个变量，用逗号隔开

for (var i=0,len=cars.length; i<len; i++)

在循环开始前已经设置了变量值时，可以省略语句1

    <script>cars = ["BMW", "Volvo", "Saab", "Ford"];var i = 2, len = cars.length;for (; i < len; i++) {document.write(cars[i] + "<br>");}</script>

循环内部有相应代码时，语句3也可以省略

    <script>cars = ["BMW", "Volvo", "Saab", "Ford"];var i = 0, len = cars.length;for (; i < len;) {document.write(cars[i] + "<br>");i++;}</script>

for in

    <p>点击下面的按钮，循环遍历对象 "person" 的属性。</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction() {var x;var txt = "";var person = { fname: "Bill", lname: "Gates", age: 56 };// x is key 键for (x in person) {txt = txt + person[x] + ' ';}document.getElementById("demo").innerHTML = txt;}</script>

在这里插入图片描述

while 循环

    <button onclick="myFunction()">点击这里</button><script>function myFunction() {var x = "", i = 0;while (i < 5) {x = x + i + " ";i++;}document.write(x);}</script>

0 1 2 3 4

do/while 循环

该循环至少会执行一次，即使条件为 false 它也会执行一次，因为代码块会在条件被测试前执行

    <p>点击下面的按钮，只要 i 小于 5 就一直循环代码块。</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction() {var x = "", i = 0;do {x = x + "该数字为 " + i + "<br>";i++;}while (i < 5)document.getElementById("demo").innerHTML = x;}</script>

在这里插入图片描述

    <script>cars = ["BMW", "Volvo", "Saab", "Ford"];var i = 0;while (cars[i]) {document.write(cars[i] + "<br>");i++;}</script>

break 和 continue

break 语句用于跳出循环
continue 用于跳过循环中的一个迭代

    <p>点击按钮，测试带有 break 语句的循环。</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction() {var x = "", i = 0;for (i = 0; i < 10; i++) {// if (i == 3) {//     break;// }// 由于这个 if 语句只有一行代码，所以可以省略花括号if (i==3) break;x = x + "该数字为 " + i + "<br>";}document.getElementById("demo").innerHTML = x;}</script>

在这里插入图片描述

    <p>点击下面的按钮来执行循环，该循环会跳过 i=3 的数字。</p><button onclick="myFunction()">点击这里</button><script>function myFunction() {var x = "", i = 0;for (i = 0; i < 10; i++) {// if (i == 3) {//     continue;// }if (i == 3) continue;x = x + i + "  ";}document.write(x);}</script>

0 1 2 4 5 6 7 8 9

    <p id="demo">点击下面的按钮来执行循环，该循环会跳过 i=3 的数字。</p><button onclick="myFunction()">点击这里</button><script>function myFunction() {var x = "", i = 0;while (i < 10) {if (i == 3) {i++;    //加入i++不会进入死循环continue;}x = x + "该数字为 " + i + "<br>";i++;}document.getElementById("demo").innerHTML = x;}</script>

在这里插入图片描述

标记 JavaScript 语句，在语句之前加上冒号

    <script>cars = ["BMW", "Volvo", "Saab", "Ford"];list: {document.write(cars[0] + "<br>");document.write(cars[1] + "<br>");document.write(cars[2] + "<br>");// 跳出 JavaScript 代码块break list;document.write(cars[2] + "<br>");document.write(cars[3] + "<br>");document.write(cars[4] + "<br>");}</script>

BMW
Volvo
Saab

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

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

相关文章

图文并茂 | 水平分表的路由策略有哪些？什么是一致性哈希？

图文并茂 | 水平分表的路由策略有哪些？什么是一致性哈希？

&#x1f449;&#x1f449;&#x1f449; 哈喽&#xff01;大家好&#xff0c;我是【大数据的奇妙冒险】的作者 &#xff0c;具有 Java 以及大数据开发经验&#xff0c;目前是一位大数据领域项目经理。 擅长 Java、大数据开发、项目管理等。持有 PMP 和 系统架构设计师证书&am…
阅读更多...
分组卷积的思想神了

分组卷积的思想神了

大家好啊&#xff0c;我是董董灿。 最近&#xff0c;分组卷积帮我解决了一个大忙&#xff0c;事情是这样的。 这几天遇到一个头疼的问题&#xff0c;就是要在某一芯片上完成一个神经网络的适配&#xff0c;这个神经网络中卷积居多&#xff0c;并且有一些卷积的通道数很大&…
阅读更多...
Sql Server中的表组织和索引组织（聚集索引结构，非聚集索引结构，堆结构）

Sql Server中的表组织和索引组织（聚集索引结构，非聚集索引结构，堆结构）

正文 SqlServer用三种方法来组织其分区中的数据或索引页&#xff1a; 1、聚集索引结构 聚集索引是按B树结构进行组织的&#xff0c;B树中的每一页称为一个索引节点。每个索引行包含一个键值和一个指针。指针指向B树上的某一中间级页&#xff08;比如根节点指向中间级节点中的…
阅读更多...
三代自动驾驶系统及主流科技公司自动驾驶技术方案简介

三代自动驾驶系统及主流科技公司自动驾驶技术方案简介

截止目前&#xff0c;按技术特点&#xff0c;自动驾驶技术大致经历了三代发展&#xff1a;第一代自动驾驶技术以后融合感知技术&#xff0c;高精度地图&#xff0c;基于惯导、GPS定位系统&#xff0c;预测模块&#xff0c;基于优化、搜索的规控等组成。第一代比较成熟的自动驾驶…
阅读更多...
Python 框架学习 Django篇 (六) 数据表关联、ORM关联

Python 框架学习 Django篇 (六) 数据表关联、ORM关联

在后端服务器开发中&#xff0c;特别是前后端分离的架构中数据库是非常重要的&#xff0c;后端主要就是负责管理数据&#xff0c;而我们经常使用的mysql、oracle 都是关系型数据库&#xff0c;什么是关系型数据库&#xff1f;就是建立在关系模型基础上的数据库&#xff0c;而最…
阅读更多...
Elasticsearch：使用 Open AI 和 Langchain 的 RAG - Retrieval Augmented Generation （二）

Elasticsearch：使用 Open AI 和 Langchain 的 RAG - Retrieval Augmented Generation （二）

这是继上一篇文章 “Elasticsearch&#xff1a;使用 Open AI 和 Langchain 的 RAG - Retrieval Augmented Generation &#xff08;一&#xff09;” 的续篇。在这篇文章中&#xff0c;我主要来讲述 ElasticVectorSearch 的使用。 我们的设置和之前的那篇文章是一样的&#xff…
阅读更多...
在线设计数据库表用Itbuilder，极简易用真香！！！

在线设计数据库表用Itbuilder，极简易用真香！！！

“如果您想要一个具有快速搜索运行的高性能数据库&#xff0c;那么数据库设计是必不可少的&#xff0c;花时间设计数据库将帮助您避免效率低下和高冗余等问题”。 在线数据库设计软件itbuilder&#xff0c;界面清爽漂亮&#xff0c;功能简洁&#xff0c;没有多余设置很容易上手…
阅读更多...
MQTT（详解）

MQTT（详解）

什么是MQTT MQTT&#xff08;Message Queuing Telemetry Transport&#xff09;是一种轻量级的通信协议&#xff0c;用于在设备之间传输消息。它通常用于物联网&#xff08;IoT&#xff09;和传感器网络中&#xff0c;可以在不同设备之间进行可靠的通信&#xff0c;而且资源消耗…
阅读更多...
MySQL3：MySQL中一条更新SQL是如何执行的？

MySQL3：MySQL中一条更新SQL是如何执行的？

MySQL3&#xff1a;MySQL中一条更新SQL是如何执行的&#xff1f; MySQL中一条更新SQL是如何执行的&#xff1f;1.Buffer Pool缓冲池2.Redo logredo log作用Redo log文件位置redo log为什么是2个&#xff1f; 3.Undo log4.更新过程5.InnoDB官网架构InnoDB架构-内存结构①Buffer …
阅读更多...
Python----break关键字对while...else结构的影响

Python----break关键字对while...else结构的影响

案例&#xff1a; 女朋友生气&#xff0c;要求道歉5遍&#xff1a;老婆大人&#xff0c;我错了。道歉到第三遍的时候&#xff0c;媳妇埋怨这一遍说的不真诚&#xff0c;是不是就是要退出循环了&#xff1f;这个退出有两种可能性&#xff1a; ① 更生气&#xff0c;不打算原谅…
阅读更多...
Xcode iOS app启用文件共享

Xcode iOS app启用文件共享

在info.plist中添加如下两个配置 Supports opening documents in place Application supports iTunes file sharing 结果都为YES&#xff0c;如下图所示&#xff1a; 然后&#xff0c;iOS设备查看&#xff0c;文件->我的iPhone列表中有一个和你工程名相同的文件夹出现&…
阅读更多...
图像去噪滤波算法汇总(Python)

图像去噪滤波算法汇总(Python)

前言 上篇文章&#xff1a;图像数据噪音种类以及Python生成对应噪音&#xff0c;汇总了常见的图片噪音以及噪音生成方法&#xff0c;主要用在数据增强上面&#xff0c;作为数据集填充的方式&#xff0c;可以避免模型过拟合。想要了解图像数据增强算法的可以去看本人所撰这篇文…
阅读更多...
2023深耕kotlin，谈谈前景

2023深耕kotlin，谈谈前景

为什么学习kotlin&#xff1f; Kotlin 早就已经是 Google 官方推荐的开发语言了&#xff0c;而且 Android 新的 Compose 框架只支持 Kotlin &#xff0c;在 Google 那里&#xff0c;Android开发中 Java 其实已经被淘汰了。Java 和 Kotlin 虽然都属于高级语言&#xff0c;但是 …
阅读更多...
Adversarial attacks and defenses on AI in medical imaging informatics: A survey

Adversarial attacks and defenses on AI in medical imaging informatics: A survey

Adversarial attacks and defenses on AI in medical imaging informatics: A survey----《AI在医学影像信息学中的对抗性攻击与防御&#xff1a;综述》 背景&#xff1a; 之前的研究表明&#xff0c;人们对医疗DNN及其易受对抗性攻击的脆弱性一直存在疑虑。 摘要&#xff1a;…
阅读更多...
设计模式：桥接模式（C#、JAVA、JavaScript、C++、Python、Go、PHP）

设计模式：桥接模式（C#、JAVA、JavaScript、C++、Python、Go、PHP）

上一篇《适配器模式》 下一篇《装饰器模式》 简介&#xff1a; 桥接模式&#xff0c;它是一种结构型设计模式&#xff0c;它的主要目的是将抽象部分与具体实现部分分离&#xff0c;使它们都可以独立地变化。…
阅读更多...
css 雷达扫描图

css 雷达扫描图

html 代码 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>css 雷达扫描</title><style>* {margin: 0;padding: 0;}body {background: #000000;height: 100vh;display: flex;align-items…
阅读更多...
计算机毕业设计 基于SpringBoot大学生创新创业项目管理系统的设计与实现 Javaweb项目 Java实战项目 前后端分离 文档报告 代码讲解 安装调试

计算机毕业设计 基于SpringBoot大学生创新创业项目管理系统的设计与实现 Javaweb项目 Java实战项目 前后端分离 文档报告 代码讲解 安装调试

&#x1f34a;作者&#xff1a;计算机编程-吉哥 &#x1f34a;简介&#xff1a;专业从事JavaWeb程序开发&#xff0c;微信小程序开发&#xff0c;定制化项目、 源码、代码讲解、文档撰写、ppt制作。做自己喜欢的事&#xff0c;生活就是快乐的。 &#x1f34a;心愿&#xff1a;点…
阅读更多...
工控安全与网络安全有什么不同？

工控安全与网络安全有什么不同？

在当代&#xff0c;全球制造业正在经历一场前所未有的技术变革。工业4.0不仅代表着自动化和数据交换的进步&#xff0c;它还揭示了工业自动化、智能制造与系统集成的融合。这种集成为企业带来了效率和质量的双重提升&#xff0c;但同时也暴露出新的安全隐患。工控系统成为了这一…
阅读更多...
不同网段的IP怎么互通

不同网段的IP怎么互通

最近在整理工作的时候发现一个不同网段无法互通的问题&#xff0c;就是我们大家熟知的一级路由和二级路由无法互通的问题。由于需要记录整个过程的完整性&#xff0c;这里也需要详细记录下整个过程&#xff0c;明白的人不用看&#xff0c;可以直接跳过&#xff0c;到解决方法去…
阅读更多...
【MyBatis Plus】深入探索 MyBatis Plus 的条件构造器，自定义 SQL语句，Service 接口的实现

【MyBatis Plus】深入探索 MyBatis Plus 的条件构造器，自定义 SQL语句，Service 接口的实现

文章目录 前言一、条件构造器1.1 什么是条件构造器1.2 QueryWrapper1.3 UpdateWrapper1.4 LambdaWrapper 二、自定义 SQL 语句2.1 自定义 SQL 的基本用法2.2 自定义 SQL 实现多表查询 三、Service 接口3.1 对 Service 接口的认识3.2 实现 Service 接口3.3 实现增删改查功能3.4 …
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023