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 转义字符
Code Output
\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

你可能感兴趣的:(javascript,前端,开发语言)