6_js数组常用函数进阶与String

1 数组常用函数的应用

1.1 数组常用方法解析进阶
  • 文档:const - JavaScript | MDN

  • 课堂案例:01.find&Some方法的应用.html

    • find() 从数组中找到满足条件的第一个元素并且并返回它。否则返回 undefined。

    • findIndex()*方法返回数组中满足提供的测试函数的第一个元素的*索引。若没有找到对应元素则返回-1。

    • some() 从数组中找到满足条件的第一个元素返回true或者false

  • 课堂案例:02.map方法的应用.html

    • map() 返回一个新的数组,这个新的数组由原数组中的每个元素都调用一次提供的函数后的返回值组成。

  • 课堂案例:03.forEach方法的应用.html

    • forEach() 可以用来遍历数组

  • 课堂案例:04.reduce方法的应用.html

    • reduce() 方法对数组中的每个元素按序执行一个由您提供的 reducer 函数,每一次运行 reducer 会将先前元素的计算结果作为参数传入,最后将其结果汇总为单个返回值。

  • 课堂案例:05.includes方法的应用.html

    • includes() 方法用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回 false

  • 课堂案例:06.slice方法的应用.html

    • slice() :可以在素组中进行拷贝需要的内容。

      • slice(start, end)

        • start:默认值0,开始的索引

        • end:默认值是arr.length,不包含尾部的。

  • 课堂案例:07.fill方法的应用.html

    • fill() 在数组内替换值(用指定的值填充数组内的值)

      • fill(value, start, end)

      • 参数一:需要替换的值

      • 参数二:从那个地方开始替换(起始索引,默认值为 0。)

      • 参数三:替换到哪里(终止索引,默认值为 arr.length。)

  • 课堂案例:08.splice方法的应用.html

    • splice() 方法通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。

  • 课堂案例:09.将数组变成字符串的方法.html

    • toString() 方法返回一个字符串,表示指定的数组及其元素。

    • join() 方法将一个数组(或一个类数组对象)的所有元素连接成一个字符串并返回这个字符串。如果数组只有一个项目,那么将返回该项目而不使用分隔符。

2. 字符串常用函数的应用

  • String 全局对象是一个用于字符串或一个字符序列的构造函数。

  • 语法:

String(thing)
new String(thing)
​
let str1 = "abc";
let str2 = new String("abc");
​
//当字符较长时,可以使用的如下两种定义方式。
//方式一
可以使用 + 运算符将多个字符串连接起来,如下所示:
let longString = "This is a very long string which needs " +"to wrap across multiple lines because " +"otherwise my code is unreadable.";
​
//方式二 可以在每行末尾使用反斜杠字符(“\”),以指示字符串将在下一行继续。确保反斜杠后面没有空格或任何除换行符之外的字符或缩进; 否则反斜杠将不会工作。
let longString = "This is a very long string which needs \
to wrap across multiple lines because \
otherwise my code is unreadable.";
​
​
//遍历字符串
const str = 'The quick red fox jumped over the lazy dog back.';
const iterator = str[Symbol.iterator]();
​
//Array.from() 字符串转换为数组
  • 课堂案例:10.定义字符串的二种形式.html

  • 课堂案例:11.遍历字符串和转换为数组.html

2.1 转义字符
CodeOutput
\0空字符
\'单引号
\"双引号
\\反斜杠
\n换行
\r回车
\v垂直制表符
\t水平制表符(就是键盘上的 tab键)
\b退格
\f换页
  • 课堂案例:12.什么是转义字符.html

2.2 基本字符串和字符串对象的区别
  • 字符串字面量 (通过单引号或双引号定义) 和 直接调用 String 方法 (没有通过 new 生成字符串对象实例) 的字符串都是基本字符串。

  • JavaScript 会自动将基本字符串转换为字符串对象,只有将基本字符串转化为字符串对象之后才可以使用字符串对象的方法。

  • 当基本字符串需要调用一个字符串对象才有的方法或者查询值的时候 (基本字符串是没有这些方法的),JavaScript 会自动将基本字符串转化为字符串对象并且调用相应的方法或者执行查询。

//字符串与字符串对象的区别
let s_prim = "foo";
let s_obj = new String(s_prim);
console.log(typeof s_prim); // Logs "string"
console.log(typeof s_obj);  // Logs "object"
​
//字符串对象转换为字符串
const stringObj = new String('foo');
console.log(stringObj);  //output: String { "foo" }
console.log(stringObj.valueOf()); // output: "foo"
  • 课堂案例:13.基本字符串和字符串对象的区别.html

2.3 字符串方法的应用一
  • 课堂案例:14.字符串常用方法的讲解1.html

    • at() 方法接受一个整数值,并返回一个新的 String,该字符串由位于指定偏移量处的单个 UTF-16 码元组成。该方法允许正整数和负整数。负整数从字符串中的最后一个字符开始倒数。

    • charAt() 方法从一个字符串中返回指定的字符。

    • startsWith() 方法用来判断当前字符串是否以另外一个给定的子字符串开头,并根据判断结果返回 truefalse

    • endsWith() 方法用来判断当前字符串是否是以另外一个给定的子字符串“结尾”的,根据判断结果返回 truefalse

2.4 字符串方法的应用二
  • 课堂案例:15.字符串常用方法的讲解2.html

    • replace() 方法返回一个由替换值(replacement)替换部分或所有的模式(pattern)匹配项后的新字符串。

    • replaceAll() 方法返回一个新字符串,新字符串所有满足 pattern 的部分都已被replacement 替换。

    • slice() 方法提取某个字符串的一部分,并返回一个新的字符串,且不会改动原字符串。

    • split() 方法使用指定的分隔符字符串将一个String对象分割成子字符串数组,以一个指定的分割字串来决定每个拆分的位置。

2.5 字符串方法的应用三
  • 课堂案例:16.字符串常用方法的讲解3.html

    • substring() 方法返回一个字符串在开始索引到结束索引之间的一个子集,或从开始索引直到字符串的末尾的一个子集。

    • trim() 方法会从一个字符串的两端删除空白字符。在这个上下文中的空白字符是所有的空白字符 (space, tab, no-break space 等) 以及所有行终止符字符(如 LF,CR 等)。

    • trimEnd() 方法从一个字符串的末端移除空白字符。trimRight() 是这个方法的别名。

    • trimStart() 方法从字符串的开头删除空格。trimLeft() 是此方法的别名。

    • toUpperCase() 方法将调用该方法的字符串转为大写形式并返回(如果调用该方法的值不是字符串类型会被强制转换)。

    • toLowerCase() 会将调用该方法的字符串值转为小写形式,并返回。

3. Try关键字

  • try...catch语句标记要尝试的语句块,并指定一个出现异常时抛出的响应。

  • 以后在写代码的时候,如果你认为这个代码可能会出问题就可以把它放到Try_catch语句中。

const str1 = "123";
try {str1 = "aaa";
} catch(error) {console.log(error);console.log("const不能修改哦")
}
console.log(str1);
  • 课堂案例:17.Try关键字的应用.html

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

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

相关文章

vue-快速原型开发

官方地址: https://cli.vuejs.org/zh/guide/prototyping.html

mybatis TypeHandler 类型处理器

目录1. 自定义日期类型处理器2. 配置自定义日期处理器3. 新增,查询1. 自定义日期类型处理器 继承mybatis提供的BaseTypeHandler覆写方法, 来转换Java和数据库中的字段package cn.bitqian.config;import org.apache.ibatis.type.BaseTypeHandler; import…

使用map递归树形结构

mapTree (data) {const reg /^e/;const regu /^u/;data.map(items > {if(items.children.length < 1){if(reg.test(items.userid)){items.disabled true //遍历树 拼入相应的disabled}else if(regu.test(items.userid)){items.children undefined }}else{this.mapTr…

分页查询插件PageHelper 5.x版本

目录1. jar包依赖2. mybatis核心文件配置3. 简简单单分页1. jar包依赖 <!--分页助手--><dependency><groupId>com.github.pagehelper</groupId><artifactId>pagehelper</artifactId><version>5.2.0</version></dependency&…

适用于ELment-UI级联多选框,数据回填,根据子节点的值查找完整路径

适用于ELment-UI级联多选框el-cascader&#xff0c;数据回填&#xff0c;根据子节点的值查找完整路径 已知子元素id,怎么获取它所有的父元素&#xff1f;用递归实现 /*** 查找匹配的完整路径* id: 匹配的值* data: 匹配的数组数据* prop: 匹配的字段名*/searchPath (id, …

多表操作查询 一对一

目录1. 一对一关系2. 一对一外键关联查询配置1. 一对一关系 数据库中的一对一关系 – 主键关联和外键关键 如person表和身份证表card 1、主键关联 create table person (pid int primary key auto_increment,pname varchar(40) not null,pgender varchar(10) not null )crea…

BZOJ-1045 糖果传递

先拆成链的情况来看。 设B[i]表示i要向i1拿糖果的数量&#xff0c;C为平均数&#xff0c;则B[i] C - A[i] B[i-1] Answer就是B的绝对值之和 现在来看环的情况&#xff0c;也就是说B[n]指的是n要向1拿糖果的数量。不妨设B[n]为K&#xff0c;则B[1] C - A[1] K………… 照着式…

一对多,多对多查询

1. 一对多配置 1. 什么是一对多 如用户表和订单表&#xff0c; 单个用户可能有多个订单&#xff0c;即一对多。如班级表和学生表 一个班级有多个学生&#xff0c;学生表的外键为 班级表的主键。如下面就是一对多&#xff0c;查询用户对应的订单配置 <?xml version"1…

优化JS代码的34种方法(上)

1. 含有多个条件的if语句 //longhand if(x abc || x def || x ghi || x jkl){//logic }//shorthand if([abc,def,ghi,jkl].includes(x)){//logic }2. if…else的缩写法 当我们在if-else条件下的逻辑比较简单时&#xff0c;我们可以使用三元条件运算符。 //longhand let …

稀疏表示

稀疏表示是近期几年信号处理领域的热点之中的一个&#xff0c;简单来说&#xff0c;它事实上是一种对原始信号的分解过程&#xff0c;该分解过程借助一个事先得到的字典&#xff08;也有人称之为过完备基&#xff0c;overcomplete basis&#xff0c;后面会介绍到&#xff09;&a…

一对一,一对多,多对多查询 (注解写法)

目录1、实体2、一对一3、一对多4、多对多5、测试核心&#xff1a; 一对一&#xff0c;注解&#xff1a;Select Results Result One 一对多 & 多对多&#xff0c;One改为Many共同的操作&#xff1a;查询多表时&#xff0c;先查一个表&#xff0c; 把这个实体属性作为查询条件…

Linux内核中影响tcp三次握手的一些协议配置

在Linux的发行版本中&#xff0c;都存在一个/proc/目录&#xff0c;有的也称它为Proc文件系统。在 /proc 虚拟文件系统中存在一些可调节的内核参数。这个文件系统中的每个文件都表示一个或多个参数&#xff0c;它们可以通过 cat 工具进行读取&#xff0c;或使用 echo 命令进行修…

ssm整合 durid数据源 报错java.sql.SQLException: Access denied for user ‘xxx‘@‘localhost‘

目录1、报错原因2、如何解决1、报错原因 连接数据库账号密码错误… 但我在jdbc.properties中检查账号&#xff0c; 密码都是正确的呀&#xff0c;&#x1f623; drivercom.mysql.cj.jdbc.Driver urljdbc:mysql://localhost:3306/mybatis_study?serverTimezoneGMT usernamer…

CS无线电语

〔Radio Commands (" Z "键) - 无线电指令〕1."Cover me" (掩护我)2."You Take The Point"(你守住这个位置)3."Hold This Position"(各单位保持现在的位置)4."REGROUP TEAM"(重新组队)&#xff0c;队友过于分散的时候可以用…

ssm整合 报错org.apache.ibatis.binding.BindingException: Invalid bound statement (not found):xxx

目录1. 报错原因2. 解决3. 说明1. 报错原因 使用MapperScannerConfigurer扫描对应的mapper接口&#xff0c;帮我把mapper放入spring容器中&#xff0c;但是我的mapper映射文件并没有关联到sessionFactory中。 加载mybatis核心配置文件时&#xff0c; 其中的环境&#xff0c;数…

Teradata Fastload 使用方法

第一步&#xff1a; 首先打开 teradata fastload.exe 第二步&#xff1a; 通过粘贴导入脚本 脚本&#xff1a; SESSIONS 4; ERRLIMIT 25; SET RECORD VARTEXT ",";LOGON localhost/Teradata_Education,Educate; /* localhost:IP Address; Teradata_Education:user…

linux编译警告 will be initialized after

http://blog.chinaunix.net/uid-17019762-id-3152012.html 作为一个有强迫症的人&#xff0c;实在是受不了 warning 的存在 这个warning是由于初始化顺序引起的, // 会出现warning 的代码&#xff01;class cInit{public: cInit(std::string str, int a) : str_(str), a_(a…

Java实现邮箱发送(阿里云邮箱推送)

Java mail邮箱发送1. 邮箱信息实体类2. jar包依赖3. 发送邮箱实现绑定阿里云域名&#xff0c;创建域名账户&#xff0c;并配置解析域名账户&#xff0c;获得发送邮箱的权限&#xff0c;上限两百封&#xff0c;超出要&#xffe5;… 阿里云邮件推送控制台https://www.aliyun.co…

Android组件系列----BroadcastReceiver广播接收器

​【声明】 欢迎转载&#xff0c;但请保留文章原始出处→_→ 生命壹号&#xff1a;http://www.cnblogs.com/smyhvae/ 文章来源&#xff1a;http://www.cnblogs.com/smyhvae/p/3960623.html 【正文】 一、广播的功能和特征 广播的生命周期很短&#xff0c;经过调用对象-->…

vue.js 入门,简介

vue的源代码下载——开发版本和生产版本 https://cn.vuejs.org/js/vue.jshttps://cn.vuejs.org/js/vue.min.js vue中文学习官网 https://cn.vuejs.org/v2/guide/ vue学习入门1. 什么是vue.js2. vue的要学的核心3. 我的第一个vue程序(&#xffe3;▽&#xffe3;)"1. 什么…