เรียนรู้เกี่ยวกับเทคนิคการวนซ้ำสตริงยอดนิยมใน JavaScript

สำหรับหลายๆ สิ่งใน JavaScript ไม่มีทางเดียวที่จะบรรลุเป้าหมายเหล่านั้นได้ สิ่งง่ายๆ อย่างการวนซ้ำอักขระแต่ละตัวในสตริงก็เป็นหนึ่งในนั้น เรามาสำรวจวิธีการบางอย่างและหารือเกี่ยวกับข้อดีและข้อเสียของมัน

โปรดทราบว่าบทความนี้มีให้ใช้งานในรูปแบบ "Interactive CodePled"

ก่อนที่เราจะเริ่ม เราต้องกลับมาที่คำถามพื้นฐานมากกว่านี้ก่อน

วิธีการเข้าถึงอักขระตัวเดียวของสตริง

ในปัจจุบัน ECMAScript 2015 (ES6) มีสองวิธีในการเข้าถึงอักขระตัวเดียว:

อักขระ()

เมธอดของ string object นี้มีมาระยะหนึ่งแล้วและถือเป็นแนวทางคลาสสิก รองรับแม้ในเบราว์เซอร์ที่เก่าแก่ที่สุด

สัญกรณ์วงเล็บ

วิธีที่สองคือการเข้าถึงอักขระผ่านเครื่องหมายวงเล็บเหลี่ยม:

วิธีการนี้ถูกนำมาใช้กับ ECMAScript 2015 และดูเหมือนว่าจะสะดวกกว่า นอกจากนี้ยังช่วยให้คุณปฏิบัติต่อสตริงเหมือนโครงสร้างที่คล้ายอาเรย์ ซึ่งจะช่วยให้สามารถทำซ้ำได้สองสามวิธี ดังที่เราจะได้เห็นเร็วๆ นี้

วิธีไหนดีกว่ากัน?

ข้อเสียของ charAt() อาจเป็นเพราะสามารถอ่านได้ อย่างไรก็ตาม มันเข้ากันได้กับเบราว์เซอร์รุ่นเก่าอย่าง IE7 ข้อโต้แย้งอีกประการหนึ่งที่ต่อต้านเครื่องหมายวงเล็บคือไม่สามารถใช้ในการกำหนดอักขระได้:

สิ่งนี้อาจทำให้เกิดความสับสน โดยเฉพาะอย่างยิ่งเนื่องจากจะไม่มีคำเตือน

ในความเห็นส่วนตัวของฉัน การใช้เครื่องหมายวงเล็บจะสะดวกกว่าในการเขียนและอ่าน ปัญหาความเข้ากันได้ควรได้รับการแก้ไขโดยการ transpiling แทนที่จะไม่ใช้คุณสมบัติที่ต้องการ

วิธียอดนิยมในการวนซ้ำสตริง

รายการเทคนิคต่อไปนี้ไม่ได้อ้างว่าเสร็จสมบูรณ์ จะแสดงแนวทางที่ใช้บ่อยที่สุดบางส่วน

เพื่อสาธิตการประมวลผลอักขระเดี่ยวของสตริง เราจะใช้ฟังก์ชันต่อไปนี้:

สำหรับวง

วิธีการแบบคลาสสิก — for วนซ้ำอย่างง่าย:

แม้ว่าการเขียนและอ่านจะยุ่งยากเล็กน้อย แต่วิธีนี้เป็นวิธีที่ทราบได้เร็วที่สุด

สำหรับ...ของ

คำสั่งนี้ถูกนำมาใช้กับ ECMAScript 2015 และสามารถใช้กับอ็อบเจ็กต์ที่ทำซ้ำได้ จะสะดวกกว่าในการเขียนมากกว่าลูป for แบบคลาสสิก หากคุณไม่สนใจดัชนีปัจจุบันในส่วนเนื้อหาของลูป

แต่ละ()

นี่คือเวอร์ชันการทำงานของ for loop หลายๆ คนชอบลูปนี้มากกว่า for…of และ for เนื่องจากเป็นฟังก์ชันที่มีลำดับสูงกว่า และช่วยให้ยึดติดกับรูปแบบการเขียนโปรแกรมที่ใช้ประโยชน์จากความไม่เปลี่ยนรูปได้ (ดูคำแนะนำสไตล์ Airbnb ในข้อมูลอ้างอิง)

ข้อเสียประการหนึ่งคือคุณต้องแปลงสตริงเป็นอาร์เรย์ก่อนที่จะวนซ้ำ หากประสิทธิภาพมีความสำคัญในกรณีการใช้งานของคุณ (และโดยปกติจะไม่สำคัญ) นั่นอาจไม่ใช่ตัวเลือกแรกของคุณ

บทสรุป

เช่นเดียวกับเทคนิคต่างๆ ใน ​​JavaScript การตัดสินใจว่าจะใช้อันใดนั้นจะขึ้นอยู่กับรสนิยมเป็นหลัก อย่างไรก็ตาม โปรดระวังผลกระทบด้านความเร็วของการแปลงสตริงเป็นอาเรย์ รวมถึงปัญหาความเข้ากันได้ของเครื่องหมายวงเล็บเหลี่ยม

ฉันแนะนำให้คุณเลือกเทคนิคที่อ่านง่ายที่สุดและสนใจเฉพาะการเพิ่มประสิทธิภาพความเร็วหากคุณมีปัญหาด้านประสิทธิภาพและแก้ไขปัญหาความเข้ากันได้ผ่านการทรานสไพล์

อ้างอิง