Cara terbaik untuk memeriksa alfanumerik di Javascript

Apa cara terbaik untuk melakukan pemeriksaan alfanumerik pada suatu INPUTbidang JSP? Saya telah melampirkan kode saya saat ini

<script type="text/javascript">
  function validateCode(){
      var TCode = document.getElementById('TCode').value;
      for(var i=0; i<TCode.length; i++)
      {
        var char1 = TCode.charAt(i);
        var cc = char1.charCodeAt(0);

        if((cc>47 && cc<58) || (cc>64 && cc<91) || (cc>96 && cc<123))
        {

        }
         else {
         alert('Input is not alphanumeric');
         return false;
         }
      }
     return true;     
   }

Anda dapat menggunakan regex ini /^[a-z0-9]+$/i

Kecenderungan asli penanya untuk menggunakan str.charCodeAt(i)tampaknya lebih cepat daripada alternatif ekspresi reguler. Dalam pengujian saya di jsPerf , opsi RegExp berkinerja 66% lebih lambat di Chrome 36 (dan sedikit lebih lambat di Firefox 31).

Berikut adalah versi pembersihan dari kode validasi asli yang menerima string dan mengembalikan trueatau false:

function isAlphaNumeric(str) {
  var code, i, len;

  for (i = 0, len = str.length; i < len; i++) {
    code = str.charCodeAt(i);
    if (!(code > 47 && code < 58) && // numeric (0-9)
        !(code > 64 && code < 91) && // upper alpha (A-Z)
        !(code > 96 && code < 123)) { // lower alpha (a-z)
      return false;
    }
  }
  return true;
};

Tentu saja, mungkin ada pertimbangan lain, seperti keterbacaan. Ekspresi reguler satu baris jelas lebih cantik untuk dilihat. Tetapi jika Anda sangat memperhatikan kecepatan, Anda mungkin ingin mempertimbangkan alternatif ini.

Periksa dengan regex.

Javascript regexen tidak memiliki kelas karakter POSIX, jadi Anda harus menulis rentang karakter secara manual:

if (!input_string.match(/^[0-9a-z]+$/))
  show_error_or_something()

Di sini ^berarti awal string dan $berarti akhir string, dan [0-9a-z]+berarti satu atau lebih karakter dari 0ke 9ATAU dari ake z.

Informasi lebih lanjut tentang Javascript regexen di sini: https://developer.mozilla.org/en/JavaScript/Guide/Regular_Expressions

Anda tidak perlu melakukannya satu per satu. Lakukan saja tes untuk semua itu bukan alfanumerik. Jika ditemukan, validasi gagal.

function validateCode(){
    var TCode = document.getElementById('TCode').value;
    if( /[^a-zA-Z0-9]/.test( TCode ) ) {
       alert('Input is not alphanumeric');
       return false;
    }
    return true;     
 }

Jika ada setidaknya satu kecocokan dari non alfa numerik, itu akan return false.

Saya akan membuat metode prototipe String:

String.prototype.isAlphaNumeric = function() {
  var regExp = /^[A-Za-z0-9]+$/;
  return (this.match(regExp));
};

Kemudian, penggunaannya adalah:

var TCode = document.getElementById('TCode').value;
return TCode.isAlphaNumeric()

    // On keypress event call the following method
    function AlphaNumCheck(e) {
        var charCode = (e.which) ? e.which : e.keyCode;
        if (charCode == 8) return true;

        var keynum;
        var keychar;
        var charcheck = /[a-zA-Z0-9]/;
        if (window.event) // IE
        {
            keynum = e.keyCode;
        }
        else {
            if (e.which) // Netscape/Firefox/Opera
            {
                keynum = e.which;
            }
            else return true;
        }

        keychar = String.fromCharCode(keynum);
        return charcheck.test(keychar);
    }

Lebih lanjut, artikel ini juga membantu memahami validasi alfanumerik JavaScript.

Permisi semua, tidak ada kontroversi. Tetapi agar komunitas dapat tumbuh seperti yang telah menumbuhkan saya di tahun-tahun ini, ada baiknya membuat beberapa catatan.

String alfanumerik yang sebenarnya adalah seperti "0a0a0a0b0c0d"dan bukan seperti "000000"atau "qwertyuio".

Semua jawaban yang saya baca di sini, dikembalikan truedalam kedua kasus. Dan maafkan saya, IMHO, ini tidak benar .

Jika saya ingin memeriksa apakah "00000"string saya alfanum, jawaban "manusia" saya tidak diragukan lagi SALAH.

Mengapa? Sederhana. Saya tidak dapat menemukan karakter huruf apa pun. Jadi, adalah string numerik sederhana [0-9].

Di sisi lain, jika saya ingin memeriksa "abcdefg"string saya, jawaban "manusia" saya malah SALAH. Saya tidak melihat angka, jadi bukan alfanumerik. Hanya alfa [a-zA-Z].

Jawaban Michael Martin-Smucker telah mencerahkan.

Namun dia bertujuan untuk mencapai kinerja yang lebih baik daripada regex. Ini benar, menggunakan cara tingkat rendah akan menghasilkan kinerja yang lebih baik. Tapi hasilnya sama saja. String "0123456789"(hanya numerik), "qwertyuiop"(hanya alfa) dan "0a1b2c3d4f4g"(alfanumerik) ditampilkan TRUEsebagai alfanumerik. /^[a-z0-9]+$/iCara regex yang sama . Alasan mengapa regex tidak berfungsi sesederhana itu. Sintaksnya []menunjukkan atau , bukan dan . Jadi, jika hanya numerik atau hanya huruf, regex mengembalikan true.

Tapi, jawaban Michael Martin-Smucker tetap mencerahkan. Untuk saya. Ini memungkinkan saya untuk berpikir di "level rendah", untuk membuat fungsi nyata yang memproses string alfanumerik dengan jelas. Saya menyebutnya seperti fungsi relatif PHP ctype_alnum( edit 2020-02-18: Di mana, bagaimanapun, ini memeriksa ATAU dan bukan DAN ).

Berikut kodenya:

function ctype_alnum(str) {
  var code, i, len;
    var isNumeric = false, isAlpha = false; //I assume that it is all non-alphanumeric



  for (i = 0, len = str.length; i < len; i++) {
    code = str.charCodeAt(i);


        switch (true){
            case code > 47 && code < 58: // check if 0-9
                isNumeric = true;
                break;
            case (code > 64 && code < 91) || (code > 96 && code < 123): //check if A-Z or a-z
                isAlpha = true;
                break;
            default: // not 0-9, not A-Z or a-z
                return false; //stop function with false result, no more checks

        }

  }

  return isNumeric && isAlpha; //return the loop results, if both are true, the string is certainly alphanumeric
};

... dan inilah DEMO

Saya datang ke diskusi ini karena saya mencari alternatif dalam javascript untuk fungsi PHP. Saya tidak menemukan jawaban "ready-to-go", tetapi seperti yang sering terjadi di Stackoverflow, konsep pengetahuan dan perbandingan satu sama lain adalah sesuatu yang luhur, yang membuat Anda berpikir tentang jawaban seseorang dan menemukan bersama solusi Anda. mencari, tetapi Anda tidak berpikir Anda mengetahuinya.

Dan bagikan!

Terbaik

Oscar

Dalam loop yang ketat, mungkin lebih baik untuk menghindari regex dan hardcode karakter Anda:

const CHARS = new Set("0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ");
function isAlphanumeric(char) {
    return CHARS.has(char);
}

Untuk memeriksa apakah input_string adalah alfanumerik, cukup gunakan:

input_string.match(/[^\w]|_/) == null