这个系列的前面几篇文章中有谈到在一个Object上使用apply、call等方法操作另一个Object的方法,今天我们来学习怎么样在String上调用Array相关方法。 在许多方面,字符串表现的好像字符数组,许多Javascript array相关方法也可以使用在String类型上,但是并不是所有的方法都可以。看下面示例:

var name = "Benjamin";

//Outputs: TypeError: [].push.call(...) is read-only
[].push.call(name, "is my name");

报错:提示Javascript中字符串是只读的,因此任何方法想改变字符串都将失败,因此可以排除掉数组的push、pop、shift、unshift、splice方法。 但是仍有一些数组的方法是可以使用在字符串上的,看下例:

var name = "Benjamin";

var res01 = [].some.call(name, function(val, index, arr) {
//Outputs:String {0: "B", 1: "e", 2: "n", 3: "j", 4: "a", 5: "m", 6: "i", 7: "n", length: 8}
console.log(arr);
return val === "B";
}); var res02 = [].every.call(name, function(val, index, arr) {
return val === "B";
}); var res03 = [].filter.call(name, function(val, index, arr) {
return val < "e";
}); //Outputs: true
console.log(res01); //Outputs: false
console.log(res02); //Outputs: ["B", "a"]
console.log(res03);

详细了解some,every,filter方法的使用,请戳:Javascript Array.prototype.some()Javascript Array.prototype.every()Javascript Array.prototype.filter(),在字符串上操作数组方法是不是感觉挺棒的,但是大家要注意到filter方法返回的是一个数组,而不是一个字符串,而arr的输出值为一个json对象。但是细细想想,这也是有道理的,call和apply方法不会改变函数的逻辑,只改变它操作的值。 但是如果上例的filter方法需要我们返回字符串,我们可以使用链式操作:

var name = "Benjamin";

var res03 = [].filter.call(name, function(val, index, arr) {
return val < "e";
}).join(""); //Outputs: ["B", "a"]
console.log(res03);

从上面来看,String是不能操作Array上的某些方法,但是我们该如何解决呢?解决此问题有一个相当简单的方式:我们可以先把字符串转换为字符数组,然后再转换为字符串。

var name  = "Benjamin",
//TypeError: [].reverse.call(...) is read-only
//res01 = [].reverse.call(name),
res02 = [].slice.call(name).reverse().join(""); //Outputs: ["B", "e", "n", "j", "a", "m", "i", "n"]
console.log([].slice.call(name)); //Outputs: ["n", "i", "m", "a", "j", "n", "e", "B"]
console.log([].slice.call(name).reverse()); //console.log(res01); // Outputs: nimajneB
console.log(res02);

res01处如果放开也会报read-only错误,关于slice方法的使用看看MDN的描述:

slice 不修改原数组,只会返回一个包含了原数组中提取的部分元素的一个新数组。原数组的元素会按照下述规则被拷贝("一级深拷贝"[one level deep]规则):

如果该元素是个对象引用 (不是实际的对象),slice 会拷贝这个对象引用到新的数组里。两个对象引用都引用了同一个对象。

如果被引用的对象发生改变,则改变将反应到新的和原来的数组中。 对于字符串和数字来说(不是 String 和 Number 对象),slice 会拷贝字符串和数字到新的数组里。在一个数组里修改这些字符串或数字,不会影响另一个数组。

如果向两个数组任一中添加了新元素,则另一个不会受到影响。

我们直接使用[].reverse.call转换没有成功,而借助slice方法来转换成字符串数组,并对其使用revserse方法,然后使用join方法再转换为字符串。 从上面的描述,有么有感觉到在String上使用Array的相关方法有点古怪,小陌生,但同时也可以很强大。希望本文简短的介绍对你在日常开发中有所帮助。 感谢您的阅读,文中不妥之处还望批评指正。如果你感觉本文对你有所帮助,请点赞!

String调用Array相关方法——有点古怪的更多相关文章

  1. 速战速决 (2) - PHP: 数据类型 bool, int, float, string, object, array

    [源码下载] 速战速决 (2) - PHP: 数据类型 bool, int, float, string, object, array 作者:webabcd 介绍速战速决 之 PHP 数据类型 boo ...

  2. Object、Function、String、Array原生对象扩展方法

    JavaScript原生对象的api有些情况下使用并不方便,考虑扩展基于Object.Function.String.Array扩展,参考了prototype.js的部分实现,做了提取和修改,分享下: ...

  3. Javascript中String、Array常用方法介绍

    string和array作为javascript内置对象,其中许多方法无论是在开发过程中,还是在面试的时候都有机会被面试官问到,这里对经常用到的方法做一个介绍,这些方法都有过很多的实际应用场景,所以对 ...

  4. [Swift通天遁地]五、高级扩展-(6)对基本类型:Int、String、Array、Dictionary、Date的扩展

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  5. JavaScript---网络编程(3)-Object、String、Array对象和prototype属性

    本节学习JavaScript的对象和方法(函数)~ Object 对象 提供所有 JScript 对象通用的功能. obj = new Object([value]) 参数 obj 必选项.要赋值为 ...

  6. JavaScript之Number、String、Array常用属性与方法手册

    Number isFinite函数 Number.isFinite() 方法用来检测传入的参数是否是一个有穷数(finite number). 语法: Number.isFinite(value) 例 ...

  7. JS中String与Array的一些常用方法

    真是恨透了这些类似于substring substr slice 要么长得像,要么就功能相近的方法... 1⃣️string 1.substring(start开始位置的索引,end结束位置索引) 截 ...

  8. Cracking the Coding Interview(String and array)

    1.1实现一个算法判断一个字符串是否存在重复字符.如果不能利用另外的数据结构又该如何实现? My solution: /** *利用类似一个hash table的计数 *然后检查这个hash tabl ...

  9. 内置对象(Math、Date、String、Array、基本包装类型)

    一.内置对象 js中三种对象:内置对象.自定义对象.浏览器对象 实例对象是指通过构造函数创建出来,然后实例化的对象(new关键字) 静态对象是指不需要创建,直接调用的对象,可以在整个JS里调用的公共对 ...

随机推荐

  1. ROS创建Web代理(Web proxy)给QQ使用HTTP代理

    使用Web代理可以提高网页的访问速度,因为访问的数据会存储在内存或是硬盘中,就会直接从代理服务器中读取.同时,为了提高网络访问的安全性,可以给Web代理服务器设置相应的权限,使它的安全性得到提高. 下 ...

  2. CFGym 100211J 题解

    一.题目 二.题意 给定一个字母表(最多也就是英文小写字母的前10个字母),一个交换表,两个字符串,判断字符串A能否通过交换表的交换方式变成字符串B. 三.思路 1.一开始,比赛时,我半模拟半记忆化地 ...

  3. id取模分表

    场景 1 假设按用户id分2个库 每个库分10张表. 分表策略 1.用户id%2 确定库  用户id%3确定表. 2.(用户id%(2*10))/ 10  取整确定库,(用户id%(2*10)%10确 ...

  4. 测试工具-PICT-微软基于数据项多个取值的正交法用例生成工具

    下载 http://download.microsoft.com/download/f/5/5/f55484df-8494-48fa-8dbd-8c6f76cc014b/pict33.msi 这里使用 ...

  5. Python2.X如何将Unicode中文字符串转换成 string字符串

    Python2.X如何将Unicode中文字符串转换成 string字符串   普通字符串可以用多种方式编码成Unicode字符串,具体要看你究竟选择了哪种编码:unicodestring = u&q ...

  6. django2.0设置默认访问路由

    搭建完毕后,打开域名,直接来个报错,如果没有访问的地址,是不合适的 在urls.py中定义,默认访问的路由 from django.contrib import admin from django.u ...

  7. Advanced Simulation Library(ASL)&& An adaptive and distributed-memory parallel implementation of the immersed boundary (IB) method (IBAMR)

    How to install asl and ibamr tools: ASL 和 IBAMR 都是有限元分析的工具,流体力学等,ASL可以使用GPU加速计算, 主机配置,i7 6代,1060, 32 ...

  8. Rhythmk 学习 Hibernate 05 - Hibernate 表间关系 [ManyToOne,OneToMany]

    1.项目结构: 1.1.场景说明: 一个订单,包含多个产品 1.2.类文件: Order.java package com.rhythmk.model; import java.util.Date; ...

  9. leetcode112

    /** * Definition for a binary tree node. * public class TreeNode { * public int val; * public TreeNo ...

  10. Spring的Cache注解

    Spring的Cache注解如下所示: @CacheConfig:主要用于配置该类中会用到的一些共用的缓存配置.在这里@CacheConfig(cacheNames = "users&quo ...