Bagaimana cara memotong string ke N karakter di Javascript?

169

Bagaimana saya bisa, menggunakan Javascript, membuat fungsi yang akan memangkas string yang dikirimkan sebagai argumen, ke panjang yang ditentukan, juga dilewatkan sebagai argumen. Sebagai contoh:

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

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

Adakah yang punya ide? Saya pernah mendengar tentang menggunakan substring, tetapi tidak begitu mengerti.

Lucio
sumber
1
"this is" = 7 karakter, apakah Anda bermaksud itu?
aziz punjani
Seperti yang dikatakan dalam pertanyaan, saya tidak terlalu yakin bagaimana menggunakan substring untuk melakukan ini. Bisakah Anda memberi saya contoh? Saya akan menerima jawaban tentu saja, jika berhasil;) @Interstellar_Coder oops, salah ketik!

Jawaban:

346

Mengapa tidak menggunakan substring saja ... string.substring(0, 7);Argumen pertama (0) adalah titik awal. Argumen kedua (7) adalah titik akhir (eksklusif). Info lebih lanjut di sini.

var string = "this is a string";
var length = 7;
var trimmedString = string.substring(0, length);
Akan
sumber
Terima kasih! Bekerja dengan sempurna. Saya akan menandainya sebagai jawaban begitu batas waktu terlewati!
24
Dan jika Anda ingin elips untuk string melebihi panjang maks (mungkin lebih bermanfaat untuk maks yang lebih panjang): var string = "this is a string"; var length = 20; var trimmedString = string.length> length? string.substring (0, panjang - 3) + "...": string.substring (0, panjang);
Will
5
Harap perhatikan bahwa string.substr (start, length) berperilaku aneh, itu akan kembali kosong jika panjangnya lebih dari panjang string. string.substring (start, end) berfungsi seperti yang diharapkan, yaitu ia akan mengembalikan string hingga akhir jika tidak ada cukup karakter untuk akhir yang diberikan!
centic
1
Gunakan string.substr. Tidak memiliki perilaku aneh, meskipun komentar sebelumnya
Gibolt
.substring(from, to)mengambil indeks . .substr (from, length) tidak, Juga .substr () dulu memiliki inkonsistensi di IE ketika argumen pertama negatif.
Bob Stein
47

Menyalin komentar Will ke dalam sebuah jawaban, karena menurut saya bermanfaat:

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

Terima kasih Will.

Dan jsfiddle untuk siapa saja yang peduli https://jsfiddle.net/t354gw7e/ :)

Jon Lauridsen
sumber
1
Tidak ada gunanya menggunakan string.substring(0, length)dalam kasus lain, karena string dijamin <= 20 karakter pada saat itu, gunakan saja string.
Nick Sweeting
15

Saya sarankan untuk menggunakan ekstensi untuk kerapian kode. Perhatikan bahwa memperluas prototipe objek internal dapat berpotensi mengacaukan pustaka yang bergantung padanya.

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

Dan gunakan seperti:

var stringObject= 'this is a verrrryyyyyyyyyyyyyyyyyyyyyyyyyyyyylllooooooooooooonggggggggggggsssssssssssssttttttttttrrrrrrrrriiiiiiiiiiinnnnnnnnnnnnggggggggg';
stringObject.trimEllip(25)
Zameer
sumber
5
Kenapa tidak? Karena Anda menimpa prototipe objek standar .trim(). Ini dapat menyebabkan perilaku tak terduga di perpustakaan dan alat lain yang mungkin Anda gunakan.
Oleg Berman
1
Itulah yang saya butuhkan
naneri
2

Sedikit terlambat ... Saya harus merespons. Ini adalah cara paling sederhana.

// 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) + '"');

Selangkah demi selangkah. .padEnd - Guarente panjang string

"Metode padEnd () mengisi string saat ini dengan string yang diberikan (diulang, jika perlu) sehingga string yang dihasilkan mencapai panjang tertentu. Padding diterapkan dari ujung (kanan) dari string saat ini. Sumber untuk interaktif ini contoh disimpan dalam repositori GitHub. " sumber: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

.substring - membatasi panjang yang Anda butuhkan

Jika Anda memilih untuk menambahkan elips, tambahkan ke output.

Saya memberi 4 contoh penggunaan JavaScript umum. Saya sangat merekomendasikan menggunakan prototipe String dengan Overloading untuk dukungan legacy. Itu membuatnya lebih mudah untuk diimplementasikan dan diubah nanti.

Matthew Egan
sumber
Halo! Baik juga menyertakan beberapa penjelasan tentang apa yang terjadi dengan kode Anda. Mengingat betapa miripnya solusi Anda dengan jawaban yang diterima, mungkin sedikit detail tentang apa yang padEnddilakukan.
Mattie
Solusi saya, jauh lebih bersih dan lebih terstandarisasi plus menunjukkan banyak penggunaan. Metode padEnd () mengisi string saat ini dengan string yang diberikan (diulangi, jika perlu) sehingga string yang dihasilkan mencapai panjang tertentu. Padding diterapkan dari ujung (kanan) dari string saat ini. Sumber untuk contoh interaktif ini disimpan dalam repositori GitHub. sumber: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Matthew Egan
1
Saya tidak mempermasalahkan kualitas jawaban Anda. Hanya saran tentang cara membuatnya lebih baik. Penjelasan Anda bagus - edit jawaban Anda dan letakkan di sana!
Mattie
Hai Matt, saya suka jawaban Anda. Sangat disayangkan bahwa Anda membalas pertanyaan yang sedikit berbeda. Dia awalnya bertanya tentang memotong string, bukan panjang string tetap kembali.
Jakub Kriz
0
    let trimString = function (string, length) {
      return string.length > length ? 
             string.substring(0, length) + '...' :
             string;
    };

Gunakan kasing,

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

trimString(string, 20);

//How to trim a string...
MD. ABU TALHA
sumber
-1

Saya pikir Anda harus menggunakan kode ini :-)

    // 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 ...
Babak
sumber
1
Saya ingin tahu mengapa Anda menambahkan jawaban ini. Pertanyaannya sudah memiliki jawaban yang diterima dan beberapa jawaban masuk akal lainnya, yang semuanya lebih sederhana dari ini. Atau apakah ":-)" Anda dimaksudkan untuk membuat lelucon ini?
Scott Sauyet
Perhatikan bahwa jawaban yang diterima juga merupakan jawaban dengan nilai tertinggi. Saya pikir Anda sedang mencoba untuk menyelesaikan masalah yang berbeda di sini. (Dan saya tidak memperhatikan hal itu ketika berkomentar sebelumnya.) Bukannya itu masalah yang tidak mungkin, tetapi pada akhirnya itu hanya sedikit terkait dengan pertanyaan yang diajukan. Milik Anda juga memiliki efek aneh bahwa dengan input yang diberikan, string output Anda 23panjang karakter, lebih panjang dari 17parameter default ditambah 4karakter dalam suffix " ...". Sepertinya aneh.
Scott Sauyet
Saya juga berpikir ini bisa menggunakan implementasi yang lebih sederhana .
Scott Sauyet