JavaScriptで文字列をN文字にトリミングする方法は?


169

JavaScriptを使用して、引数として渡された文字列を、引数として渡された指定の長さにトリミングする関数を作成するにはどうすればよいですか。例えば:

var string = "this is a string";
var length = 6;
var trimmedString = trimFunction(length, string);

// trimmedString should be:
// "this is"

誰かがアイデアを持っていますか?部分文字列の使用について何か聞いたことがありますが、よくわかりません。


1
「これは」= 7文字ですが、それでよろしいですか?
aziz punjani

質問で述べたように、サブストリングを使用してこれを行う方法がよくわかりません。例を挙げていただけませんか?もちろん、それが機能すれば、答えは受け入れます;)@Interstellar_Coderおっと、タイプミス!

回答:


346

なぜ部分文字列を使用しないのか... string.substring(0, 7);最初の引数(0)が開始点です。2番目の引数(7)は終了点です(これを含まない)。詳細はこちら。

var string = "this is a string";
var length = 7;
var trimmedString = string.substring(0, length);

ありがとう!完璧に動作します。制限時間が経過したらすぐに回答としてマークします!

24
また、最大長を超える文字列の省略記号が必要な場合(おそらく、より長いmaxの方が便利です):var string = "this is a string"; 変数の長さ= 20; var trimmedString = string.length> length?string.substring(0、length-3)+ "...":string.substring(0、length);
ウィル

5
string.substr(start、length)の動作がおかしいことに注意してください。長さが文字列の長さよりも長い場合は空を返します。string.substring(start、end)は期待どおりに機能します。つまり、指定された末尾に十分な文字がない場合は、末尾までの文字列を返します。
センティック2015

1
を使用しstring.substrます。以前のコメントにもかかわらず、奇妙な動作はありません
Gibolt 2017

.substring(from, to)インデックスを取る。.SUBSTR(長さ、から)(また.SUBSTR、しない)するために使用される最初の引数が負の場合IEに矛盾しています。
Bob Stein

47

Willのコメントを回答にコピーしました。

var string = "this is a string";
var length = 20;
var trimmedString = string.length > length ? 
                    string.substring(0, length - 3) + "..." : 
                    string;

ありがとうウィル。

そして、https://jsfiddle.net/t354gw7e/を気にする人のためのjsfiddle :)


1
string.substring(0, length)elseの場合は使用しても意味がありません。その時点では文字列が20文字以下であることが保証されているため、を使用してくださいstring
Nick Sweeting

15

私はコードをきちんと整理するために拡張機能を使うことを勧めます。内部オブジェクトのプロトタイプを拡張すると、それらに依存するライブラリが混乱する可能性があることに注意してください。

String.prototype.trimEllip = function (length) {
  return this.length > length ? this.substring(0, length) + "..." : this;
}

そしてそれを次のように使用します:

var stringObject= 'this is a verrrryyyyyyyyyyyyyyyyyyyyyyyyyyyyylllooooooooooooonggggggggggggsssssssssssssttttttttttrrrrrrrrriiiiiiiiiiinnnnnnnnnnnnggggggggg';
stringObject.trimEllip(25)

5
何故なの?標準オブジェクトのプロトタイプを上書きしているからです.trim()。これにより、使用する他のライブラリやツールで予期しない動作が発生する可能性があります。
Oleg Berman 2017

1
それが私が必要としたもの
naneri


2

少し遅れて...私は応答しなければなりませんでした。これが最も簡単な方法です。

// JavaScript
function fixedSize_JS(value, size) {
  return value.padEnd(size).substring(0, size);
}

// JavaScript (Alt)
var fixedSize_JSAlt = function(value, size) {
  return value.padEnd(size).substring(0, size);
}

// Prototype (preferred)
String.prototype.fixedSize = function(size) {
  return this.padEnd(size).substring(0, size);
}

// Overloaded Prototype
function fixedSize(value, size) {
  return value.fixedSize(size);
}

// usage
console.log('Old school JS -> "' + fixedSize_JS('test (30 characters)', 30) + '"');
console.log('Semi-Old school JS -> "' + fixedSize_JSAlt('test (10 characters)', 10) + '"');
console.log('Prototypes (Preferred) -> "' + 'test (25 characters)'.fixedSize(25) + '"');
console.log('Overloaded Prototype (Legacy support) -> "' + fixedSize('test (15 characters)', 15) + '"');

一歩一歩。.padEnd-文字列の長さを保証します

「padEnd()メソッドは、現在の文字列を指定された文字列でパディングし(必要に応じて繰り返されます)、結果の文字列が指定された長さに達します。パディングは現在の文字列の最後(右)から適用されます。このインタラクティブのソース例はGitHubリポジトリに保存されています。」ソース:developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

.substring-必要な長さの制限

楕円を追加する場合は、楕円を出力に追加します。

一般的なJavaScriptの使用例を4つ挙げました。レガシーサポートのために、オーバーロードを含むStringプロトタイプを使用することを強くお勧めします。これにより、後で実装して変更することがはるかに簡単になります。


こんにちは!コードで何が起こっているかについての説明も含めるとよいでしょう。あなたの解決策が受け入れられた答えにどれほど似ているかを考えると、おそらくは何をしpadEndているのかについての詳細。
Mattie

私のソリューションは、はるかにクリーンで標準化されており、複数の使用法を示しています。padEnd()メソッドは、結果の文字列が指定された長さに達するように、現在の文字列を指定された文字列でパディングします(必要に応じて繰り返されます)。パディングは現在の文字列の最後(右)から適用されます。このインタラクティブな例のソースは、GitHubリポジトリに格納されています。ソース:developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...
マシュー・イーガン

1
私はあなたの答えの質に異議を唱えていません。それをより良くする方法についての単なる提案。あなたの説明は素晴らしいです-あなたの答えを編集してそこに入れてください!
Mattie

こんにちはマット、あなたの答えが好きです。少し違う質問に答えているのは気の毒です。彼はもともと、固定された文字列の長さを返すのではなく、文字列をトリミングすることについて尋ねました。
Jakub Kriz

0
    let trimString = function (string, length) {
      return string.length > length ? 
             string.substring(0, length) + '...' :
             string;
    };

使用事例、

let string = 'How to trim a string to N chars in Javascript';

trimString(string, 20);

//How to trim a string...

-1

あなたはこのコードを使うべきだと思います:-)

    // sample string
            const param= "Hi you know anybody like pizaa";

         // You can change limit parameter(up to you)
         const checkTitle = (str, limit = 17) => {
      var newTitle = [];
      if (param.length >= limit) {
        param.split(" ").reduce((acc, cur) => {
          if (acc + cur.length <= limit) {
            newTitle.push(cur);
          }
          return acc + cur.length;
        }, 0);
        return `${newTitle.join(" ")} ...`;
      }
      return param;
    };
    console.log(checkTitle(str));

// result : Hi you know anybody ...

1
なぜこの回答を追加したのか興味があります。質問にはすでに受け入れられた回答と他のいくつかの合理的な回答がありますが、これらはすべてこれより簡単です。または、あなたの ":-)"はこれを冗談にするつもりでしたか?
Scott Sauyet

受け入れられた回答も最高評価の回答であることに注意してください。ここで別の問題を解決しようとしていると思います。(そして、私が以前にコメントしたとき、私はそれに気づいていませんでした。)それがありそうもない問題であるということではありませんが、結局それは尋ねられた質問にわずかに関連しているだけです。また、指定された入力では、出力文字列がデフォルトのパラメータとサフィックス内の文字を加えたもの23よりも長いという奇妙な効果もあり17ます。それは奇妙に思えます。4" ..."
Scott Sauyet

また、これはより簡単な実装を使用できると思います。
Scott Sauyet
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.