JavaScript学习笔记02

JavaScript笔记02

数据类型详解

字符串

  • 在 JavaScript 中正常的字符串都使用单引号' '或者双引号" "包裹
  • 例:

在这里插入图片描述

转义字符

  • 在 JavaScript 字符串中也可用使用转义字符(参考:详解转义字符):
  • 例:

在这里插入图片描述

编写多行字符串

  • 在 JavaScript 中可以使用 ` 符号(键盘Tab键上面、Esc键下面的键)将多行字符串包裹来编写多行字符串
  • 例:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><script>"use strict";//编写多行字符串:使用 ` 符号(键盘Tab键上面、Esc键下面的键)将多行字符串包裹let msg =`hello
world
你好
世界`</script>
</head>
<body></body>
</html>
  • 在浏览器控制台中输入console.log(msg),打印上面编写的多行字符串:

在这里插入图片描述

模板字符串

  • JavaScript 还支持使用模板字符串(ES6新特性)
  • 例:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><script>"use strict";//模板字符串let name = "张三"let msg = `你好呀,${name}`</script>
</head>
<body></body>
</html>
  • 在浏览器控制台中输入console.log(msg),打印字符串msg

在这里插入图片描述

获取字符串的长度 & 指定下标位置的字符

  • 我们可以通过使用字符串.length来获取字符串的长度,也可以通过使用字符串[下标]来获取字符串中指定下标位置的字符
  • 例:

在这里插入图片描述

可变性:不可变

  • 需要注意的是,JavaScript 中的字符串是不可变的
  • 例:

在这里插入图片描述

大小写转换

  • 注意:以下使用的是函数(方法),而不再是属性
  • 我们可以使用toUpperCase()方法将字符串中的小写字母转换为大写;也可以使用toLowerCase()方法将字符串中的大写字母转换为小写
  • 例:

在这里插入图片描述

获取指定字符在字符串中的下标

  • 我们可以使用indexOf()方法获取指定字符在字符串中的下标
  • 例:

在这里插入图片描述

截取字符串

  • 我们可以使用substring()方法截取指定下标区间内的字符串(左闭右开区间)
  • 例:

在这里插入图片描述

数组

  • 在 JavaScript 中,数组可以包含任意类型的数据
  • 例:

在这里插入图片描述

长度

  • 我们可以通过使用数组.length来获取数组的长度
  • 例:

在这里插入图片描述

  • 注意:给数组的lentgh赋值,数组的大小就会发生变化;如果赋的值过小,元素就会丢失!
  • 例:

在这里插入图片描述

获取指定元素在数组中的下标索引

  • 我们可以使用indexOf()方法来获取指定元素在数组中的下标索引
  • 例:

在这里插入图片描述

  • 注意,上述例子中的数字1和字符串"1"是不同的!

截取数组 - slice()

  • 我们可以使用slice()方法来截取指定下标区间内的数组,返回一个新的数组,类似字符串中的substring()方法。
  • 例:

在这里插入图片描述

从尾部添加与删除元素 - push() & pop()

  • push() - 向数组尾部添加元素(可以添加一个或多个),并返回添加后数组的长度。
  • pop() - 从数组的尾部删除一个元素(删且只删除一个),并返回被删除的元素。
  • 例:

在这里插入图片描述

从头部添加与删除元素 - unshift() & shift()

  • unshift() - 向数组头部添加元素(可以添加一个或多个),并返回添加后数组的长度。
  • shift() - 从数组的头部删除一个元素(删且只删除一个),并返回被删除的元素。
  • 例:

在这里插入图片描述

排序 - sort()

  • sort() - 对数组的项目进行排序,并返回排序后的数组 。
  • 排序顺序可以是按字母或数字,也可以是升序(向上)或降序(向下)。
  • 默认情况下,sort() 方法将按字母和升序将值作为字符串进行排序。
  • 例:

在这里插入图片描述

元素反转 - reverse()

  • reverse() - 反转数组中元素的顺序,并返回同一数组的引用。
  • 例:

在这里插入图片描述

拼接数组 - concat()

  • concat() - 用于拼接两个或多个数组。
  • 注意:concat() 方法不会更改现有数组,而是返回一个新数组,其中包含已连拼数组的值。
  • 例:

在这里插入图片描述

分隔符 - join()

  • join - 将数组中的所有元素转换为一个字符串,并且这个字符串中的所有元素都通过指定的分隔符进行分隔。
  • 例:

在这里插入图片描述

多维数组

  • JavaScript 中多维数组的定义方式以及多维数组中指定下标位置元素的获取方式如下:
  • 例:

在这里插入图片描述

对象

  • 补充:在 JavaScript 中,所有的键都是字符串,值是任意对象。
  • 例如:在调用对象中的属性时,除了可以使用对象名.属性名,还可以使用属性名["属性值"]这种方式调用:

在这里插入图片描述

定义对象

  • 在 JavaScript 中,对象是若干个属性的键值对(属性:属性值)的集合,多个属性之间用逗号隔开,最后一个属性后则不添加逗号
let 对象名 = {属性名: 属性值,属性名: 属性值,属性名: 属性值
}
  • 例:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><script>// 定义一个person对象let person = {name: "张三",age: 18,gender: "男",score: 80}</script>
</head>
<body></body>
</html>

对象赋值

  • 和 Java 一样,在 JavaScript 中给对象中的属性赋值也是直接使用等号=
  • 例:

在这里插入图片描述

使用不存在的属性

  • 在 JavaScript 中即使我们使用了一个不存在的对象属性,也不会报错,而是会返回undefined
  • 例:

在这里插入图片描述

动态的删减属性

  • 在 JavaScript 中,我们可以通过使用delete,实现动态的删除对象中的属性
  • 例:

在这里插入图片描述

动态的添加属性

  • 在 JavaScript 中,我们还可以动态的添加属性,直接给新的属性添加值即可
  • 例:

在这里插入图片描述

判断属性是否在这个对象中

  • 我们可以使用"属性名" in 对象名来判断属性是否在这个对象中
  • 例:

在这里插入图片描述

判断属性是否是这个对象自身拥有的 - hasOwnProperty()

  • 我们可以使用对象名.hasOwnProperty("属性名")来判断属性是否是这个对象自身拥有的
  • 例:

在这里插入图片描述

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

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

相关文章

基于JAVA+SSM+微信小程序+MySql的图书捐赠管理系统设计与实现

✌全网粉丝20W,csdn特邀作者、博客专家、CSDN新星计划导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ &#x1f345;文末获取项目下载方式&#x1f345; 一、项目背景介绍&#xff1a; 在当今社会&#xff0…

基于matlab实现的额特征线法管道瞬变流计算程序

完整曲线&#xff1a; % 假设阀门瞬间关闭 % 初始数据: clear tic L3000; % 管线长度 Hr70; % 泵压力 N10; % 分段数 NSN1; % 节点数 e0.001651; % 壁厚m,0.065 D0.00635-2*e; % 管道内径 K2.1e9; % 流体体积弹性系数 Rho…

javascript检测网页缩放演示代码

一、为什么会提示浏览器显示比例不正常&#xff1f; 在网上冲浪&#xff0c;有时在打某个网站时&#xff0c;会提示你的浏览器显示比例不是100%&#xff0c;建议你将浏览器显示比例恢复为100%&#xff0c;以便获得最佳显示效果。 二、检测网页缩放比例的方法 那么这些网站是如…

IDEA设置Maven 镜像

第一步&#xff1a;右键项目&#xff0c;选择Maven->Create ‘settings.xml’ 已经存在的话是Open ‘settings.xml’&#xff1a; 第二步&#xff1a;在settings.xml文件中增加阿里云镜像地址&#xff0c;代码如下&#xff1a; <?xml version"1.0" encodin…

Apache HTTPD 换行解析漏洞(CVE-2017-15715)

漏洞描述 Apache HTTPD是一款HTTP服务器&#xff0c;它可以通过mod_php来运行PHP网页。其2.4.0~2.4.29版本中存在一个解析漏洞&#xff0c;在解析PHP时&#xff0c;1.php\x0A将被按照PHP后缀进行解析&#xff0c;导致绕过一些服务器的安全策略。 漏洞原理 此漏洞的出现是由于…

JavaSE、JavaEE与Spring的概念和异同点剖析以及规范13 个分析

JavaSE、JavaEE与Spring的概念和异同点剖析以及规范13 个分析 目录概述需求&#xff1a; 设计思路实现思路分析1.什么是JavaSE2.是JavaEE3.什么是Spring 参考资料和推荐阅读 Survive by day and develop by night. talk for import biz , show your perfect code,full busy&…

LeetCode【4. 寻找两个正序数组的中位数】

快乐安康 给定两个大小分别为 m 和 n 的正序&#xff08;从小到大&#xff09;数组 nums1 和 nums2。请你找出并返回这两个正序数组的 中位数 。 算法的时间复杂度应该为 O(log (mn)) 。 public double findMedianSortedArrays(int[] nums1, int[] nums2) {if (nums1.length &…

精品SpringCloud的B2C模式在线学习网微服务分布式

《[含文档PPT源码等]精品基于SpringCloud实现的B2C模式在线学习网站-微服务-分布式》该项目含有源码、文档、PPT、配套开发软件、软件安装教程、项目发布教程等 软件开发环境及开发工具&#xff1a; 开发语言&#xff1a;Java 框架&#xff1a;springcloud JDK版本&#xf…

python连接mysql数据库的练习

一、导入pandas内置的sqlite3模块&#xff0c;连接的信息&#xff1a;ip地址是本机, 端口号port 是3306, 用户user是root, 密码password是123456, 数据库database是lambda-xiaozhang import pymysql# 打开数据库连接&#xff0c;参数1&#xff1a;主机名或IP&#xff1b;参数…

在SpringSecurity + SpringSession项目中如何实现当前在线用户的查询、剔除登录用户等操作

1、前言 在前一篇《在SpringBoot项目中整合SpringSession&#xff0c;基于Redis实现对Session的管理和事件监听》笔记中&#xff0c;已经实践了在SpringBoot SpringSecurity 项目中整合SpringSession&#xff0c;这里我们继续尝试如何统计当前在线用户&#xff0c;思路如下&am…

gma 2.0.1 (2023.09.15) 更新日志

安装 gma 2.0.1 pip install gma2.0.1修复 1、【栅格处理-栅格分解】   修复了由于关联模块调整导致类方法失效引起的函数功能异常的问题。 2、【栅格处理-栅格更新相关】   修复了自身数据更新相关的函数&#xff08;例如 添加颜色映射表 等&#xff09;格式检查不通过的…

el-table 列背景色渐变

最初的想法是&#xff0c;给每一行添加背景色&#xff0c;逐行递减透明度&#xff0c;发现结果比较突兀&#xff0c;效果如下&#xff1a; 如果有需要这种样式的&#xff0c;代码如下&#xff1a; <template><div><el-table:data"tableData":heade…

uniapp抽取组件绑定事件中箭头函数含花括号无法解析

版本: "dcloudio/uni-ui": "^1.4.27", "vue": "> 2.6.14 < 2.7"... 箭头函数后含有花括号的时候, getData就拿不到val参数 , 解决办法就是去除花括号 // 错误代码: <SearchComp change"(val) > { getData({ val …

【计算机网络】 TCP——四次挥手

文章目录 流程考点 流程 主动方打算关闭连接&#xff0c;此时会发送一个TCP首部FIN标志位被置为1的报文&#xff0c;也即FIN报文&#xff0c;之后主动方进入FIN_WAIT_1状态。被动方收到该报文后&#xff0c;就向主动方发送ACK应答报文&#xff0c;接着被动方进入CLOSE_WAIT状态…

解决 Axios 跨域问题,轻松实现接口调用

跨域是指访问另外一个域的资源&#xff0c;由于浏览器的同源策略&#xff0c;默认情况下使用 XMLHttpRequest 和 Fetch 请求时是不允许跨域的。跨域的根本原因是浏览器的同源策略&#xff0c;这是由浏览器对 JavaScript 施加的安全限制。 Axios 跨域常见报错 跨域请求被阻止 (…

AI图片生成 discord 使用midjourney

参考: 不用找咒语了&#xff01;Midjourney图生文功能特征解析&#xff0c;玩转Describe命令&#xff0c;快速搞定AI绘画_哔哩哔哩_bilibili 1 登录 discord 2 点发现 找 midjourney 3 创建 服务器 -> 亲自创建 4 选 仅供我和我的朋友使用 5 起个 服务器名字 6 加bot 由于…

(21)多线程实例应用:双色球(6红+1蓝)

一、需求 1.双色球: 投注号码由6个红色球号码和1个蓝色球号码组成。 2.红色球号码从01--33中选择,红色球不能重复。 3.蓝色球号码从01--16中选择。 4.最终结果7个号码&#xff1a;61&#xff1b;即33选6(红) 16选1(蓝) 5.产品: …

【计算思维题】少儿编程 蓝桥杯青少组计算思维 数学逻辑思维真题详细解析第9套

蓝桥杯青少组计算思维 数学逻辑思维真题详细解析第9套 第十四届蓝桥杯省赛真题 1、要把下面4张图片重新排列成蜗牛的画像,该如何排列这些图片 A、 B、 C、 D、 答案:A 考点分析:主要考查小朋友们的观察能力空

搭建自己的OCR服务,第一步:选择合适的开源OCR项目

一、OCR是什么&#xff1f; 光学字符识别&#xff08;Optical Character Recognition, OCR&#xff09;是指对文本资料的图像文件进行分析识别处理&#xff0c;获取文字及版面信息的过程。 亦即将图像中的文字进行识别&#xff0c;并以文本的形式返回。 二、OCR的基本流程 1…

Truenas scale 配置Zerotier

Zerotier 注册 官网注册 zerotier&#xff0c; Truenas 安装 Zerotier Truenas的 APP -> Available Applications 中搜索 zerotier 在 Network中填入 zerotier 注册账户后给你的ID。 勾选 Host Network 在这里插入图片描述 Zerotier 中给定权限 左侧 框框 打钩&#…