Dưới đây là 4 cách để tách một từ thành một mảng các ký tự. "Tách" là cách phổ biến nhất và mạnh mẽ hơn. Nhưng với việc bổ sung ES6, có nhiều công cụ hơn trong kho JS để sử dụng 🧰
Tôi luôn thích xem tất cả các cách có thể để giải quyết vấn đề nào đó vì sau đó bạn có thể chọn cách tốt nhất cho trường hợp sử dụng của mình. Ngoài ra, khi bạn thấy nó bật lên trong cơ sở mã của ai đó, bạn sẽ hiểu nó một cách dễ dàng 👍
const string = 'word';
// Option 1
string.split[''];
// Option 2
[...string];
// Option 3
Array.from[string];
// Option 4
Object.assign[[], string];
// Result:
// ['w', 'o', 'r', 'd']
- kịch bản
- Mảng ký tự
- Dấu phân cách cụ thể
- Chuỗi chứa Biểu tượng cảm xúc
- Thông báo trước về Object. chỉ định ⚠️
- Đầu vào của cộng đồng
- Tài nguyên
# kịch bản
Thay vì đi qua những ưu và nhược điểm của từng cách khác nhau. Để tôi chỉ cho bạn các tình huống khác nhau trong đó cái này được ưu tiên hơn cái kia
# Mảng ký tự
Nếu tất cả những gì bạn đang làm là muốn tách chuỗi theo từng ký tự chuỗi, tất cả các cách đều tốt và sẽ cho bạn kết quả tương tự
const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
# Dấu phân cách cụ thể
Nếu bạn muốn tách chuỗi của mình theo một ký tự cụ thể, thì
const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
3 là cách tốt nhấtconst string = 'split-by-dash';
const usingSplit = string.split['-'];
// [ 'split', 'by', 'dash' ]
Các cách khác chỉ bị giới hạn bởi mỗi ký tự chuỗi
const string = 'split-by-dash';
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result:
// [ 's', 'p', 'l', 'i', 't', '-', 'b', 'y', '-', 'd', 'a', 's', 'h' ]
# Chuỗi chứa Biểu tượng cảm xúc
Nếu chuỗi của bạn chứa biểu tượng cảm xúc, thì
const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
3 hoặc const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
5 có thể không phải là lựa chọn tốt nhất. Hãy xem điều gì sẽ xảy raconst string = 'cake😋';
const usingSplit = string.split[''];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'c', 'a', 'k', 'e', '�', '�' ]
Tuy nhiên, nếu chúng ta sử dụng những cách khác, nó hoạt động
________số 8
Điều này là do
const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
3 phân tách các ký tự theo đơn vị mã UTF-16, điều này có vấn đề vì các ký tự biểu tượng cảm xúc là UTF-8. Nếu chúng ta nhìn vào biểu tượng cảm xúc yum của mình const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
7 thì nó thực sự được tạo thành từ 2 ký tự KHÔNG PHẢI 1 như chúng ta nhận thấyconst string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
1Đây là cái được gọi là cụm grapheme- nơi người dùng coi nó là 1 đơn vị, nhưng trên thực tế, nó được tạo thành từ nhiều đơn vị. Các phương pháp mới hơn
const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
8 và const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
9 được trang bị tốt hơn để xử lý các phương thức này và sẽ phân tách chuỗi của bạn theo cụm grapheme 👍# Thông báo trước về const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
5 ⚠️
const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
Một điều cần lưu ý
const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
5 là nó không thực sự tạo ra một mảng thuần túy. Hãy bắt đầu với định nghĩa của nóđối tượng. phương thức gán [] sao chép tất cả các thuộc tính riêng có thể đếm được từ một hoặc nhiều đối tượng nguồn sang đối tượng đích
Chìa khóa ở đó là "sao chép tất cả các thuộc tính riêng có thể đếm được". Vì vậy, những gì chúng tôi đang làm ở đây
const string = 'split-by-dash';
const usingSplit = string.split['-'];
// [ 'split', 'by', 'dash' ]
2 nó sao chép TẤT CẢ các thuộc tính chuỗi của chúng tôi sang mảng mới của chúng tôi. Điều đó có nghĩa là chúng ta có một Array PLUS một số phương thức chuỗi# Kiểm tra TypeScript. Mảng kết quả không phải là loại const string = 'split-by-dash';
const usingSplit = string.split['-'];
// [ 'split', 'by', 'dash' ]
3 😱
const string = 'split-by-dash';
const usingSplit = string.split['-'];
// [ 'split', 'by', 'dash' ]
Điều này thể hiện rõ hơn nếu chúng ta sử dụng TypeScript Playground. Vui lòng sao chép mã và dán vào sân chơi, nơi bạn có thể di chuột vào biến để xem các loại. Vì đây chỉ là bài viết nên mình sẽ dán kết quả vào đây để các bạn tiện theo dõi
const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
8Tuy nhiên, nếu chúng ta nhìn vào loại kết quả của
const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
5. Nó không cung cấp cho chúng ta một Mảng chuỗiconst string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
0# Kiểm tra TypeScript. Mảng kết quả có thể truy cập thuộc tính chuỗi 😱
Chúng tôi có thể kiểm tra thêm điều này bằng cách truy cập một thuộc tính chỉ dành cho một
const string = 'split-by-dash';
const usingSplit = string.split['-'];
// [ 'split', 'by', 'dash' ]
5const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
2Vì vậy, điều đó có nghĩa là nếu tôi gọi
const string = 'split-by-dash';
const usingSplit = string.split['-'];
// [ 'split', 'by', 'dash' ]
6 trên Mảng của chúng tôi, nó sẽ cho chúng tôi biết thuộc tính này không tồn tại. Đây là những gì chúng tôi mong đợi để xemconst string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
0NHƯNG, nếu chúng ta gọi
const string = 'split-by-dash';
const usingSplit = string.split['-'];
// [ 'split', 'by', 'dash' ]
6 trên Mảng được cho là do const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
5 tạo, thì nó hoạt động 😱const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
1☝️ Và điều này là do
const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
5 sao chép TẤT CẢ các thuộc tính từ Chuỗi ban đầu. Đây là cách tôi giải thích nó theo thuật ngữ không dành cho nhà phát triển. Bạn đi đến một cửa hàng để mua một con chó. Nhưng sau đó cửa hàng const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
5 bán cho bạn một chú chó có đôi cánh rồng. Điều này nghe có vẻ rất tuyệt, nhưng đây không thực sự là một thú cưng thân thiện cho thuê. Hừm. Tôi không nghĩ rằng đây là ví dụ tốt nhất của tôi. Nhưng tôi nghĩ bạn hiểu ý tôi 😂# Chuyển đổi có vẻ ổn trong trình duyệt 🙂
Bây giờ tôi không nghĩ rằng đây là một sự phá vỡ thỏa thuận lớn, bởi vì
Có vẻ như các trình duyệt có sẵn một số loại cơ chế để thực hiện Object một cách "an toàn". gán[[], "string"] và tránh thêm các phương thức của chuỗi đó vào mảng
Cảm ơn bạn @lukeshiru. đã chia sẻ kiến thức này cho tôi 👏 Anh ấy cũng đã tạo mã sân chơi TypeScript để bạn có thể xem > liên kết
# Đầu vào của cộng đồng
@Đội trưởngOrion_. Biến chuỗi thành mảng char nhưng dùng hàm map 🤣
const string = 'hi there';
const usingSplit = string.split[''];
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]
2@hiUmesh2.
const string = 'split-by-dash';
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result:
// [ 's', 'p', 'l', 'i', 't', '-', 'b', 'y', '-', 'd', 'a', 's', 'h' ]
1 cũng sẽ làm điều đó@nội bộ. mã số. Thông tin thêm. sẽ an toàn hơn khi sử dụng toán tử trải rộng [phương pháp thứ hai] thay vì
const string = 'split-by-dash';
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result:
// [ 's', 'p', 'l', 'i', 't', '-', 'b', 'y', '-', 'd', 'a', 's', 'h' ]
2 [phương pháp đầu tiên], vì const string = 'split-by-dash';
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result:
// [ 's', 'p', 'l', 'i', 't', '-', 'b', 'y', '-', 'd', 'a', 's', 'h' ]
3 không hoạt động với một số ký tự không phổ biến@faerberrr. Tôi có một chuỗi chứa các ký tự đặc biệt như
const string = 'split-by-dash';
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result:
// [ 's', 'p', 'l', 'i', 't', '-', 'b', 'y', '-', 'd', 'a', 's', 'h' ]
4, v.v. Khi tôi chia nhỏ chúng bằng phương pháp const string = 'split-by-dash';
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result:
// [ 's', 'p', 'l', 'i', 't', '-', 'b', 'y', '-', 'd', 'a', 's', 'h' ]
5 và chạy const string = 'split-by-dash';
const usingSpread = [...string];
const usingArrayFrom = Array.from[string];
const usingObjectAssign = Object.assign[[], string];
// Result:
// [ 's', 'p', 'l', 'i', 't', '-', 'b', 'y', '-', 'd', 'a', 's', 'h' ]
6, nó trả về gấp đôi giá trị dự kiến. Chuyển sang toán tử trải rộng đã khắc phục sự cố