如何求两个字符串的交集? 用js求字符串交集和字符串相减结果

最新推荐文章于 2023-03-27 18:57:47 发布
最新推荐文章于 2023-03-27 18:57:47 发布
阅读量3.1k 收藏 1
点赞数
分类专栏： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_21650491/article/details/108041587
版权
本文介绍如何使用JavaScript求两个字符串的交集并从一个字符串中删除交集部分。通过将字符串转为数组，使用split(), filter(), 和 splice()函数，实现了这一功能。文章提供了详细的解题思路及核心代码示例。" 120839885,8754438,CAD二次开发：自定义下拉菜单与工具栏实践与技巧,"['CAD开发', 'c#', 'CAD界面定制']

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

用js求字符串交集和字符串相减结果

有时候我们可能会求两个字符串的交集，也就是找到两个字符串里面相同的元素，偶尔也会需要把一个字符串里的与另外的一个字符串重合的元素给删除掉，所以诞生了这篇文章。下面给出案例：
已知有a,b两个字符串，字符串都是由多个词语组成且中间有空格隔开，想要知道a,b字符串有哪些词语相同，并且把其中a字符串内a&b同时存在（即交集）的词语给删除掉，得到一个新的字符串。

解题思路：
1.先把字符串使用split()函数转变成数组
2.再使用filter()函数求得交集
3.使用splice()函数删除双重循环下相同的词语元素
4.把交集和结果集输出到页面上

先看效果图：
在这里插入图片描述

在这里插入图片描述

核心代码如下：

<script>
    // js如何获取textarea框中的值
    // textareaElement的value属性行，而innerHTML属性不行
    function trans() {
        //通过id获取dom对象
        var textarea_source = document.getElementById('textarea_source');
        var textarea_translate = document.getElementById('textarea_translate');
        var textarea_jiao = document.getElementById('textarea_jiao');
        var textarea_result = document.getElementById('textarea_result');
        //获取dom对象的字符串
        var textSourse = textarea_source.value;
        var textfocus = textarea_translate.value;
        //以空格分割字符串转变为a,b数组
        var a = textSourse.split(" ");
        var b = textfocus.split(" ");
        //求得a,b两个数组的交集
        var jiao = a.filter((val) => new Set(b).has(val));
        //判断是否需要继续运行下去，如果没有交集，终止程序
        if (jiao.length==0){
            //弹框提示
            alert('不存在交集，字符串无法相减')
            //终止程序
            return;
        }
        //输出交集
        textarea_jiao.innerHTML = jiao.join(' ');
        //字符串减法运算得到结果字符串数组
        var result_string = arrChange(a, b);

        //转换数组为字符串且替换非空字符输出结果集
        textarea_result.value = result_string.join(' ').replace(/\s+/g, ' ');
        //去重
        quchongstr();
    }

    /*数组相减的方法*/
    function arrChange(a, b) {
        for (var i = 0; i < b.length; i++) {
            for (var j = 0; j < a.length; j++) {
                if (a[j] == b[i]) {//如果是id相同的，那么a[ j ].id == b[ i ].id
                    a.splice(j, 1);
                    j = j - 1;
                }
            }
        }
        return a;
    }
    //去重的方法
    function quchongstr() {
        //通过id获取dom对象
        var textarea_translate = document.getElementById('textarea_result');
        //得到具体值
        var str = textarea_translate.value;
        //转换为数组
        var a = str.match(/\S+/g);//等价于str.split(/\s+/g)// \s空白符，\S非空白符
        //排序
        a.sort();
        //双重循环进行去重
        for (var i = a.length - 1; i > 0; i--) {
            if (a[i] == a[i - 1]) {
                a.splice(i, 1);
            }
        }
        console.log('去重成功！');
        //数组转换成字符串
        var finalstr = a.join(" ");
        //输出字符串到页面上
        textarea_translate.value = finalstr;
    }
</script>

注释得十分详细，请直接看注释，下面是html代码：

<!DOCTYPE html>
<html lang="cn">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>字符串求交集和相减的结果集-字符串工具集</title>

    <!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">


    <!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 -->
    <!-- 警告：通过 file:// 协议（就是直接将 html 页面拖拽到浏览器中）访问页面时 Respond.js 不起作用 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
      <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
    <![endif]-->
    <meta charset="UTF-8">

    <style>
        .my_title {
            /*width: 200px;*/
            margin: 50px 400px;
            font-size: 50px;
            text-align: center;
        }

        .my_part {
            margin: 35px;
        }

        h2 {
            text-align: center;
            font-size: 50px;
            font-weight: bold;
            font-family: 幼圆;
            margin: 50px 200px;
        }

        .my_content {
            margin: 20px;
            text-align: center;
        }
    </style>
</head>

<body>
    <article class="my_title">
        <div class="panel panel-primary">
            <div class="panel-heading">
                <h3 class="panel-title">字符串工具集 2020年8月16日</h3>
            </div>
            <div class="panel-body">
                <h2>字符串求交集和相减的结果集</h2>
                <p class="lead" style='text-align: left;'>
                    已知有a,b两个字符串，字符串都是由多个词语组成且中间有空格隔开，想要知道a,b字符串有哪些词语相同，并且把其中a字符串内a&b同时存在（即交集）的词语给删除掉，得到一个新的字符串。</p>
                <p class="lead" style="text-align: left;">
                    解题思路：<br>1.先把字符串使用split()函数转变成数组<br>2.再使用filter()函数求得交集<br>3.使用splice()函数删除双重循环下相同的词语元素<br>4.把交集和结果集输出到页面上
                </p>
            </div>
        </div>
    </article>
    <article class="my_part">
        <div class="my_content">
            <div style="display: inline-block;">
                <textarea name="my_source" id="textarea_source" placeholder="请输入被减字符串 a:" cols="120"
                    rows="15"></textarea>
            </div>

            <div style="display: inline-block;">
                <textarea name="my_tanslate" id="textarea_translate" placeholder="请输入减字符串 b:" cols="120"
                    rows="15"></textarea>
            </div>

            <div style="display: inline-block;">
                <textarea name="my_tanslate" id="textarea_jiao" placeholder="交集输出~" cols="120" rows="15"></textarea>
            </div>

            <div style="display: inline-block;">
                <textarea name="my_tanslate" id="textarea_result" placeholder="结果集输出~" cols="120" rows="15"></textarea>
            </div>
            <br>
            <button type="button" class="btn btn-primary" id="myButton4" data-complete-text="Loading finished"
                onclick="trans()">请点击我
            </button>
            <br>

        </div>

    </article>

</body>
【核心代码放置处】
</html>

需要使用请直接把核心代码替换html里面的末尾**【核心代码放置处】**既可

寻找两个字符串的交集（c语言）
qq_62416768的博客
01-02 3149
我的思路： 1.将两个字符串简化，将里面重复的字母减少为一个。 2.拼接两个字符串，借助循环把重复出现两次的字符找出来。
C语言拯救者（模拟实现字符串函数和内存函数--11）
我心如火
04-08 2894
C语言没有字符串类型，字符串通常存放在常量字符串或者字符数组中。字符串库函数和内存函数的使用和注意事项，模拟库函数及详解
js 交集
qq_41299637的博客
03-19 353
Set 对象存储的值总是唯一的 Set 对象方法 方法 描述 add 添加某个值，返回Set对象本身。 clear 删除所有的键/值对，没有返回值。 delete 删除某个键，返回true。如果删除失败，返回false。 forEach 对每个元素执行指定操作。 has 返回一个布尔值，表示某个键是否在当前 Set 对象之中。 Set 对象作用 数组去重 原文链接: link. ...
找到两个字符串集合的交集
gfgdsg的专栏
11-13 2927
set SplitString(string str) { set split; char *cstr = new char[str.length() + 1]; strcpy(cstr, str.c_str()); char *temp = strtok(cstr, ","); while (temp) { split.insert(temp); temp = strtok(
获得两个字符串的交集字符串
rl0516的专栏
08-21 1331
<br /> string a = "abcdefg"; string b = "defghlik"; var c = a.ToCharArray().Intersect(b.ToCharArray()); string res = new string(c.ToArray<char>()); Console.WriteLine(res); 
字符串的交集
weixin_45895555的博客
03-23 778
注：针对的小写字母，大写字母稍微改改代码即可，输出结果是按照26字母排序的，希望按原顺序的话自己再加点代码就可以。 暂时没发现啥问题，有问题评论交流叭！谢谢指教！ 这里是借助了ASCII码来写的，a的ASCII值为97，那么s[a-‘a’] = a[0]。 #include <iostream> using namespace std; int main(){ string a = "sdzcd"; string s = "skjhwzdsckbsdjcbhsdj"; s
Pattern和Matcher详解（字符串匹配和字节码）
热门推荐
思緒凌亂
03-25 1万+
一：起因 （1）Java里面进行字符串操作，第一个想到的是String类 和 StringBuilder类 内含replace() 、replaceAll() 、split()、matches()等方法 —— 其实String类里面的           public String[] split(String regex, int limit) 和 matches()方法，调用是Pattern
数组、字符串、链表、树面试题汇总
nanjunxiao的专栏
06-26 2316
数组 1.      如何用递归实现数组求和 2.      如何用一个for打印出一个二维数组 A[count/col][count%col] 3.      在顺序表中插入和删除一个节点平均移动多少个节点 插入：（0+n）/2 删除：（0+n-1）/2 4.      如何用递归算法判断一个数组是否是递增？ Bool up(int a[],int beg,int end) {
提桶跑路之Python基础:序列、字符串、字典、集合、身份运算符、是否可变对象
weixin_69011755的博客
05-11 305
字符串定义:单、双引号和三引号(可换行)，换行符\n 但三引号一般是用来注释，用单、引号进行定义 序列类型:指的是有序的排列(字符串，列表，元祖)。判断是否是序列类型:看他有没有顺序，能不能通过下标取值，能就属于序列类型，字典不是，集合也不是 字符串:str1='hello world' str1[0] 'h' 字符串能进行下标取值，也能进行切片(左闭右开) 字符串不可以修改 str1[0]='a'(列表可以直接修改，字符串会报错) 实在要改，就用str.replace('h','a'..
JAVA-判断两个单链表是否相交并求交点
dhaibo1986的专栏
07-08 1613
文章目录1.两个链表都不存在环2.两个链表均存在环 在上一篇文档中，通过java实现了单链表反转的问题，之后发现一个更有意思的问题就是如何判断两个链表是否相交？如果相交，则需要得到交点。 对于这个问题，需要分别考虑链表上是否存在环的情况。 //链表节点 public class DataNode { private int data; private DataNode next; public int getData() { return data; } public void setD
JS计算两个数组的交集、差集、并集、补集（多种实现方式）
12-12
方法一：最普遍的做法 使用 ES5 语法来实现虽然会麻烦些，但兼容性最好，不用考虑浏览器 JavaScript 版本。也不用引入其他第三方库。 1，直接使用 filter、concat 来计算 var a = [1,2,3,4,5] var b = [2,4,6,8,10] //交集 var c = a.filter(function(v){ return b.indexOf(v) > -1 }) //差集 var d = a.filter(function(v){ return b.indexOf(v) == -1 }) //补集 var e = a.filter(function(v){
JavaScript中两个字符串的匹配
Web开发专栏
10-26 2080
工作中遇到一个问题，两个字符串匹配，要求：每个字符串中最多含有一个*，?可以无限多个 *代表一个任意长度的字符串，而?则代表一个字符 要求可以提示出两个冲突 用Javascript实现代码如下： function checkMarchX() { var str1 = document.getElementById('str1').value; var str2 =
求两个字符串的交集
XxuelangL的专栏
10-01 1万+
题目：给定两个字符串，求
JS使用filter判断交集
youcijibi的博客
03-18 606
var ap = true; if (days.includes(parseInt(day)) && rid == 64) { limit_time_range.filter(function(v){ if(select_time_ranges.indexOf(v) !==-1 ){ ap = false; } ...
两组字符串取交集、差集，并集
weixin_43883907的博客
09-24 1659
取交集 s = 'abcdef' b = 'bced' 结果：{'c', 'e', 'd', 'b'} f =(set(s)).intersection(set(b)) 取并集 f =(set(s)).union(set(b)) 结果：{'d', 'e', 'f', 'c', 'b', 'a'} 取差集 f =(set(s)).difference(set(b)) 结果：{'a', 'f'}
两个数组进行比较_面试经常会遇到这种算法题：数组的交集（双指针）
weixin_39687814的博客
12-05 723
不啰嗦，我们先进入正文，来一起头脑风暴，思考这道题目。头脑风暴！！题目给定两个数组，编写一个函数来计算它们的交集。说明：输出结果中每个元素出现的次数，应与元素在两个数组中出现的次数一致。我们可以不考虑输出结果的顺序。示例输入: nums1 = [1,2,2,1], nums2 = [2,2]输出: [2,2]输入: nums1 = [4,9,5], nums2 = [9,4,9,8,4]输出: [...
获取两个字符串数组的交集
bobohoo的专栏
03-13 864
public static String[] getInterSection(String[] arr1, String[] arr2) { if(ArrayUtils.isEmpty(arr1)|| ArrayUtils.isEmpty(arr2)) { return new String[0]; } HashSet&l...
js取交集、并集、差集（es6中 set 方法）
Shimeng_1989的博客
09-22 489
let arr1 = new Set([1, 2, 3]); let arr2 = new Set([4, 3, 2]); // 并集 let union = new Set([...arr1, ...arr2]); // Set {1, 2, 3, 4} // 交集 let intersect = new Set([...arr1].filter(x => arr12.has(x))); // set {2, 3} // 差集 let difference = new Set([....
字符串交集--《每日学习》
Oswaldhs的博客
03-27 144
每日学习
aa={'d':2,'dd':6} bb={'d':12,'dd':16} 使用python代码，求解两个字典对应键的差值
最新发布
04-03
好的，我现在要解决的问题是：给定两个字典aa和bb，它们的键相同，要求用Python代码计算这两个字典对应键的值的差值。首先，我需要明确用户的需求，然后思考如何实现这个功能。 首先，用户给出的例子是： aa = {'d'...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值