UNPKG

camote-utils

Version:

A comprehensive TypeScript utility library featuring advanced string and number formatting, data structures, and algorithms

1,004 lines (925 loc) 78.1 kB
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>camote-utils Documentation</title> <link rel="icon" type="image/png" href="./favicon.ico"> <meta name="description" content="Documentation for camote-utils TypeScript utility library"> <meta property="og:title" content="Camote Utils - TypeScript Utility Library" /> <meta property="og:type" content="website" /> <meta property="og:url" content="https://dev-rhynel.github.io/camote-utils" /> <meta property="og:image" content="https://github.com/user-attachments/assets/9302d4b2-38fd-4869-97b2-72616b22682f"/> <meta property="og:description" content="A comprehensive TypeScript utility library featuring advanced string and number formatting, data structures, and algorithms." /> <link rel="stylesheet" href="./style.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/themes/prism-tomorrow.min.css"> </head> <body> <button class="menu-toggle hidden-desktop" aria-label="Toggle menu"> <i class="fas fa-bars" aria-hidden="true"></i> </button> <aside class="sidebar"> <nav> <div class="nav-group"> <h3>Getting Started</h3> <ul class="nav-links"> <li><a href="#installation">Installation</a></li> <li><a href="#basic-usage">Basic Usage</a></li> </ul> </div> <div class="nav-group"> <h3>API Reference</h3> <ul class="nav-links"> <li> <a href="#chain" class="has-submenu">Chain Operations <i class="fas fa-chevron-down"></i></a> <ul> <li><a href="#chain-syntax">Chain Syntax</a></li> <li><a href="#static-methods">Static Methods</a></li> <li><a href="#chain-methods">Chain Methods</a></li> </ul> </li> <li> <a href="#checkers" class="has-submenu">Checkers <i class="fas fa-chevron-down"></i></a> <ul> <li> <a href="#type-checking" class="has-submenu">Type Checking <i class="fas fa-chevron-down"></i></a> <ul> <li><a href="#type-checking-functions">Available Functions</a></li> <li><a href="#type-checking-usage">Usage Examples</a></li> </ul> </li> <li> <a href="#string-validation">String Validation</a> </li> </ul> </li> <li> <a href="#number-formatting" class="has-submenu">Number Formatting <i class="fas fa-chevron-down"></i></a> <ul> <li><a href="#humanReadableNumber">humanReadableNumber</a></li> <li><a href="#formatPercent">formatPercent</a></li> <li><a href="#formatDecimals">formatDecimals</a></li> </ul> </li> <li> <a href="#currency-formatting" class="has-submenu">Currency Formatting <i class="fas fa-chevron-down"></i></a> <ul> <li><a href="#formatCurrency">formatCurrency</a></li> </ul> </li> <li> <a href="#price-calculations" class="has-submenu">Price Calculations <i class="fas fa-chevron-down"></i></a> <ul> <li><a href="#calculateDiscountPrice">calculateDiscountPrice</a></li> </ul> </li> <li> <a href="#string-manipulation" class="has-submenu">String Manipulation <i class="fas fa-chevron-down"></i></a> <ul> <li><a href="#pluralize">pluralize</a></li> <li><a href="#capitalize">capitalize</a></li> <li><a href="#capitalizeWords">capitalizeWords</a></li> <li><a href="#truncate">truncate</a></li> <li><a href="#toCamelCase">toCamelCase</a></li> <li><a href="#toKebabCase">toKebabCase</a></li> <li><a href="#toSnakeCase">toSnakeCase</a></li> <li><a href="#slugify">slugify</a></li> <li><a href="#slugifyRevert">slugifyRevert</a></li> <li><a href="#wordCount">wordCount</a></li> <li><a href="#pad">pad</a></li> <li><a href="#mask">mask</a></li> <li><a href="#format">format</a></li> <li><a href="#reverse">reverse</a></li> <li><a href="#clean">clean</a></li> <li><a href="#toUpperCase">toUpperCase</a></li> <li><a href="#toLowerCase">toLowerCase</a></li> <li><a href="#chopStart">chopStart</a></li> <li><a href="#chopEnd">chopEnd</a></li> <li><a href="#contains">contains</a></li> <li><a href="#exactly">exactly</a></li> <li><a href="#trim">trim</a></li> <li><a href="#explode">explode</a></li> <li><a href="#toUnicodes">toUnicodes</a></li> <li><a href="#toHtmlEntities">toHtmlEntities</a></li> <li><a href="#swapCase">swapCase</a></li> </ul> </li> <li> <a href="#array-manipulation" class="has-submenu">Array Manipulation <i class="fas fa-chevron-down"></i></a> <ul> <li><a href="#removeDuplicates">removeDuplicates</a></li> <li><a href="#flattenArray">flattenArray</a></li> <li><a href="#filterArray">filterArray</a></li> <li><a href="#transformArray">transformArray</a></li> <li><a href="#capitalizeEach">capitalizeEach</a></li> <li><a href="#implode">implode</a></li> </ul> </li> <li> <a href="#object-manipulation" class="has-submenu">Object Manipulation <i class="fas fa-chevron-down"></i></a> <ul> <li><a href="#removeEmptyKeysEntries">removeEmptyKeysEntries</a></li> <li><a href="#objectToQueryString">objectToQueryString</a></li> <li><a href="#objectFilterByKeys">objectFilterByKeys</a></li> </ul> </li> <li> <a href="#deep-manipulation" class="has-submenu">Deep Manipulation <i class="fas fa-chevron-down"></i></a> <ul> <li><a href="#deepClone">deepClone</a></li> <li><a href="#deepCompare">deepCompare</a></li> <li><a href="#deepMerge">deepMerge</a></li> <li><a href="#deepSortAlphabetical">deepSortAlphabetical</a></li> </ul> </li> <li> <a href="#date-validation" class="has-submenu">Date Validation <i class="fas fa-chevron-down"></i></a> <ul> <li><a href="#isDateWithinRange">isDateWithinRange</a></li> </ul> </li> <li> <a href="#random-generation" class="has-submenu">Random Generation <i class="fas fa-chevron-down"></i></a> <ul> <li><a href="#random-integers">Integer Generation</a></li> <li><a href="#random-strings">String Generation</a></li> <li><a href="#random-passwords">Password Generation</a></li> <li><a href="#random-colors">Color Generation</a></li> <li><a href="#random-uuid">UUID Generation</a></li> <li><a href="#random-generic">Generate Random By Type</a></li> </ul> </li> </ul> </div> <div class="nav-group"> <h3>Advanced</h3> <ul class="nav-links"> <li><a href="#typescript">TypeScript Usage</a></li> <li><a href="#browser-support">Browser Support</a></li> </ul> </div> <div class="nav-group"> <h3>Community</h3> <ul class="nav-links"> <li><a href="#license">License</a></li> <li><a href="#security">Security</a></li> <li><a href="#contributors">Contributors</a></li> </ul> </div> </nav> </aside> <main class="main-content"> <div class="header-content"> <a href="index.html" class="logo-link"><img src="https://github.com/user-attachments/assets/9302d4b2-38fd-4869-97b2-72616b22682f" width="100" alt="camote-utils icon" class="logo"></a> <div> <h1>camote-utils <img src="https://static-production.npmjs.com/255a118f56f5346b97e56325a1217a16.svg" width="18" alt="camote-utils"> </h1> <div> <a href="https://www.npmjs.com/package/camote-utils"> <img src="https://img.shields.io/npm/v/camote-utils.svg" alt="npm version"> </a> <a href="https://opensource.org/licenses/MIT"> <img src="https://img.shields.io/badge/License-MIT-yellow.svg" alt="License: MIT"> </a> <a href="https://www.npmjs.com/package/camote-utils"> <img src="https://img.shields.io/npm/dt/camote-utils.svg" alt="Total Downloads"> </a> <a href="https://github.com/rhynel/camote-utils"> <img src="https://img.shields.io/badge/coverage-100%25-brightgreen.svg" alt="Coverage"> </a> <a href="https://github.com/rhynel/camote-utils"> <img src="https://img.shields.io/badge/maintenance-active-brightgreen.svg" alt="Maintenance"> </a> <a href="https://github.com/dev-rhynel/camote-utils"> <img src="https://img.shields.io/github/stars/dev-rhynel/camote-utils.svg" alt="GitHub Stars"> </a> <a href="https://twitter.com/devrhynel"> <img src="https://img.shields.io/twitter/follow/devrhynel.svg?style=social" alt="Twitter Follow"> </a> </div> <a href="https://buymeacoffee.com/rhynel" target="_blank"> <img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 50px; margin-top: 12px; "> </a> </div> </div> <div class="feature-grid"> <div class="feature-card feature-card-dark"> <i class="fas fa-bolt feature-icon"></i> <h3>Fast & Lightweight</h3> <p>Zero dependencies, tree-shakeable, and optimized for performance</p> </div> <div class="feature-card feature-card-dark"> <i class="fas fa-shield-alt feature-icon"></i> <h3>Type-Safe</h3> <p>Written in TypeScript with full type definitions</p> </div> <div class="feature-card feature-card-dark"> <i class="fas fa-code feature-icon"></i> <h3>Easy to Use</h3> <p>Simple, intuitive API with comprehensive documentation</p> </div> </div> <section id="getting-started"> <h2>Getting Started</h2> <section id="installation"> <h3>Installation</h3> <p>Install camote-utils using npm:</p> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content" style="position: relative;"> <button class="copy-button" aria-label="Copy code"> <i class="fas fa-copy" id="copy-icon"></i> <i class="fas fa-check" id="check-icon" style="display: none;"></i> <!-- Hidden by default --> </button> <pre><code class="language-bash">npm install camote-utils</code></pre> </div> </div> </section> <section id="basic-usage"> <h3>Basic Usage</h3> <p>Here are some examples of basic functionality:</p> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content"> <pre><code class="language-typescript">import { _, pluralize } from 'camote-utils' // String manipulation pluralize('cat', 1) // 'cat' pluralize('cat', 2) // 'cats' pluralize('box', 2) // 'boxes' pluralize('baby', 2) // 'babies' pluralize('person', 1, 'people') // 'person' pluralize('person', 2, 'people') // 'people' // Masking _.mask('1234567890') // '1234******' _.mask('123456NiCe', '#') // '1234######' _.mask('123456NiCe', '#', 4, 'start') // '####56NiCe' // Basic formatting _.humanReadableNumber(1234567.89) // "1.2M" // With units _.humanReadableNumber(1500, { decimals: 0 }) // "2K"</code></pre> </div> </div> </section> </section> <section id="chain"> <h2>Chain Operations</h2> <p>Chain operations allow you to perform multiple operations on a value in a fluent interface.</p> <section id="chain-syntax"> <h3>Chain Syntax</h3> <p>Use the chain syntax to perform multiple operations in sequence:</p> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content"> <pre><code class="language-typescript">import { _ } from 'camote-utils const result = _.chain('hello world') .capitalize() .truncate(5) // Hello</code></pre> </div> </div> </section> <section id="static-methods"> <h3>Static Methods</h3> <p>Use static methods for direct operations:</p> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content"> <pre><code class="language-typescript">import { capitalize, truncate } from 'camote-utils capitalize('hello world') // Hello world truncate('hello world', 5) // hello...</code></pre> </div> </div> </section> <section id="chain-methods"> <h3>Chain Methods</h3> <p>Methods available in the chain sequence:</p> <ul> <li>capitalize(): Capitalizes the first character</li> <li>truncate(length: number): Truncates to specified length</li> <li>toLowerCase(): Converts to lowercase</li> <li>toUpperCase(): Converts to uppercase</li> <li>trim(): Removes leading/trailing whitespace</li> </ul> </section> </section> <section id="checkers"> <h2>Checkers</h2> <p>Utility functions for type checking and validation.</p> <section id="type-checking"> <h3>Type Checking and String Validation</h3> <section id="type-checking-functions"> <h4>Available Functions</h4> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content"> <pre><code class="language-typescript">// Type checking functions isString(value: any): boolean; // Check if value is a string isNumber(value: any): boolean; // Check if value is a number isBoolean(value: any): boolean; // Check if value is a boolean isArray(value: any): boolean; // Check if value is an array isObject(value: any): boolean; // Check if value is an object isNull(value: any): boolean; // Check if value is null isUndefined(value: any): boolean; // Check if value is undefined isFunction(value: any): boolean; // Check if value is a function isEmpty(value: any): boolean; // Check if value is empty </code></pre> </div> </div> </section> <section id="type-checking-usage"> <h4>Usage Examples</h4> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content"> <pre><code class="language-typescript">// Basic type checking isString('hello') // true isString(123) // false isNumber(42) // true isNumber('42') // false isArray([1, 2, 3]) // true isArray({ foo: 'bar'}) // false isObject({ name: 'John' }) // true isObject([1, 2, 3]) // false // Checking for null and undefined isNull(null) // true isNull(undefined) // false isUndefined(undefined) // true isUndefined(null) // false isEmpty('') // true isEmpty([]) // true isEmpty({}) // true isEmpty(null) // true isEmpty(undefined) // true isEmpty('hello') // false</code></pre> </div> </div> </section> </section> <section id="string-validation"> <h3>String Validation</h3> <section id="string-validation-functions"> <h4>Available Functions</h4> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content"> <pre><code class="language-typescript">// String validation functions isEmail(value: string): boolean; // Validate email format isUrl(value: string): boolean; // Validate URL format isStrongPassword(value: string, options?: PasswordOptions): boolean; // Validate password strength isValidTime(value: string): boolean; // Validate time format interface PasswordOptions { minLength?: number; // Minimum length (default: 8) minLowercase?: number; // Minimum lowercase chars (default: 1) minUppercase?: number; // Minimum uppercase chars (default: 1) minNumbers?: number; // Minimum numbers (default: 1) minSymbols?: number; // Minimum special chars (default: 1) }</code></pre> </div> </div> </section> <section id="string-validation-usage"> <h4>Usage Examples</h4> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content"> <pre><code class="language-typescript">// Email validation isEmail('user@example.com') // true isEmail('invalid-email') // false // URL validation isUrl('https://example.com') // true isUrl('not-a-url') // false // Password strength validation const passwordOptions = { minLength: 8, minLowercase: 1, minUppercase: 1, minNumbers: 1, minSymbols: 1 }; isStrongPassword('Abc123!@#', passwordOptions) // true isStrongPassword('weakpass', passwordOptions) // false isValidTime('14:30') // true</code></pre> </div> </div> </section> </section> </section> <section id="number-formatting"> <h2>Number Formatting</h2> <section id="humanReadableNumber"> <h3>humanReadableNumber(number, options)</h3> <p>Formats a number with various options:</p> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content"> <pre><code class="language-typescript">// Basic formatting humanReadableNumber(1234567.89) // "1.2M" humanReadableNumber(1234.5, { decimals: 0 }) // "1,235" // With units humanReadableNumber(1500, { compact: true }) // "1.5K" humanReadableNumber(1500000, { compact: true }) // "1.5M" humanReadableNumber(1500, { decimals: 0 }) // "2K" humanReadableNumber(999, { decimals: 0 }) // "999"</code></pre> </div> </div> </section> <section id="formatPercent"> <h3>formatPercent(number, options)</h3> <p>Formats a number as a percentage:</p> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content"> <pre><code class="language-typescript">formatPercent(0.1234) // "12.34%" formatPercent(0.1234, { decimals: 1 }) // "12.3%"</code></pre> </div> </div> </section> <section id="formatDecimals"> <h3>formatDecimals(number, decimals)</h3> <p>Formats a number with fixed decimal places:</p> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content"> <pre><code class="language-typescript">formatDecimals(123.456, 2) // "123.46" formatDecimals(123.4, 2) // "123.40" formatDecimals(123.456, 2, 'ceil') // "123.46" formatDecimals(123.456, 2, 'floor') // "123.45"</code></pre> </div> </div> </section> </section> <section id="currency-formatting"> <h2>Currency Formatting</h2> <section id="formatCurrency"> <h3>formatCurrency(amount, currency?, locale?)</h3> <p>Formats a number as currency:</p> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content"> <pre><code class="language-typescript">// Basic usage formatCurrency(1234.56) // "$1,234.56" formatCurrency(1234.56, 'EUR') // "€1,234.56" formatCurrency(1234.56, 'JPY', 'ja-JP') // "¥1,235" formatCurrency(1234.56, 'GBP', 'en-GB') // "£1,234.56"</code></pre> </div> </div> </section> </section> <section id="price-calculations"> <h2>Price Calculations</h2> <section id="calculateDiscountPrice"> <h3>calculateDiscountPrice(price, discount)</h3> <p>Calculates the final price after applying a discount:</p> <div class="code-window"> <div class="code-header"> <div class="code-dot"></div> <div class="code-dot"></div> <div class="code-dot"></div> </div> <div class="code-content"> <pre><code class="language-typescript">// Calculate a fixed discount of $30 on an original price of $100 calculateDiscountPrice(100, 30, '$') // 70 // Calculate a percentage discount of 10% on an original price of $200 calculateDiscountPrice(200, 0.10, '%') // 180 // Calculate a fixed discount of $15 on an original price of $50 calculateDiscountPrice(50, 15, '$') // 35 // Calculate a percentage discount of 25% on an original price of $80 calculateDiscountPrice(80, 0.25, '%') // 60 // Calculate a fixed discount of $0 on an original price of $100 (no discount) calculateDiscountPrice(100, 0, '$') // 100 // Calculate a percentage discount of 0% on an original price of $150 (no discount) calculateDiscountPrice(150, 0, '%') // 150</code></pre> </div> </div> </section> </section> <section id="string-manipulation"> <h2>String Manipulation</h2> <p>Functions for manipulating and formatting strings.</p> <section id="capitalize"> <h3>capitalize</h3> <p>Capitalizes the first letter of a string.</p> <pre><code class="language-typescript">capitalize("hello") // "Hello"</code></pre> </section> <section id="capitalizeWords"> <h3>capitalizeWords</h3> <p>Capitalizes the first letter of each word in a string.</p> <pre><code class="language-typescript">capitalizeWords("hello world") // "Hello World"</code></pre> </section> <section id="truncate"> <h3>truncate</h3> <p>Truncates a string to a specified length and adds an ellipsis.</p> <pre><code class="language-typescript">truncate("Hello World", 8) // "Hello..."</code></pre> </section> <section id="toCamelCase"> <h3>toCamelCase</h3> <p>Converts a string to camelCase.</p> <pre><code class="language-typescript">toCamelCase("hello-world") // "helloWorld"</code></pre> </section> <section id="toKebabCase"> <h3>toKebabCase</h3> <p>Converts a string to kebab-case.</p> <pre><code class="language-typescript">toKebabCase("helloWorld") // "hello-world"</code></pre> </section> <section id="toSnakeCase"> <h3>toSnakeCase</h3> <p>Converts a string to snake_case.</p> <pre><code class="language-typescript">toSnakeCase("helloWorld") // "hello_world"</code></pre> </section> <section id="slugify"> <h3>slugify</h3> <p>Converts a string to a URL-friendly slug.</p> <pre><code class="language-typescript">slugify("Hello World!") // "hello-world"</code></pre> </section> <section id="slugifyRevert"> <h3>slugifyRevert</h3> <p>Converts a slug back to title case.</p> <pre><code class="language-typescript">slugifyRevert("hello-world") // "Hello World"</code></pre> </section> <section id="wordCount"> <h3>wordCount</h3> <p>Counts the number of words in a string.</p> <pre><code class="language-typescript">wordCount("Hello world") // 2</code></pre> </section> <section id="pad"> <h3>pad</h3> <p> The <code>pad</code> function extends a string to a specified length by adding a specified character to the start, end, or both sides of the string. This is useful for aligning text or ensuring consistent string lengths in formatted outputs. </p> <h4>Examples:</h4> <pre><code class="language-typescript">pad("hello", 8) // "hello " pad("hello", 8, "*", "start") // "***hello" pad("hello", 8, "*", "both") // "*hello**" pad("hello", 8, " ", "both") // " hello "</code></pre> <h4>Scenarios:</h4> <ul> <li>Aligning text in console outputs or logs for better readability.</li> <li>Formatting numbers with leading zeros for consistency in reports.</li> <li>Creating fixed-width fields in text-based user interfaces.</li> </ul> </section> <section id="mask"> <h3>mask</h3> <p> The <code>mask</code> function extends a string to a specified length by adding a specified character to the start, end, or both sides of the string. This is useful for aligning text or ensuring consistent string lengths in formatted outputs. </p> <h4>Examples:</h4> <pre><code class="language-typescript">// Number of characters to keep visible (default: 6) mask('1234567890') // '1234******' mask('123456NiCe', '#') // '1234######' mask('1234567890', '*', 4) // '1234******' mask('1234567890', '*', 7, 'start') // '*******890' mask('1234567890', '*', 5, 'end') // '12345*****' mask('camote2025', '*', 4) // 'camote****' // default true mask('1234567890', '*', 6, 'end', false) // '1234567890' </code></pre> <h4>Scenarios:</h4> <ul> <li>Masking sensitive information, such as credit card numbers or social security numbers.</li> <li>Creating placeholders for user input fields in forms.</li> <li>Displaying sensitive data in a secure way in console logs or error messages.</li> </ul> </section> <section id="format"> <h3>format</h3> <p>Formats a string by replacing placeholders with provided values.</p> <pre><code class="language-typescript">format("Hello {name}!", { name: "World" }) // "Hello World!"</code></pre> </section> <section id="reverse"> <h3>reverse</h3> <p>Reverses a string.</p> <pre><code class="language-typescript">reverse("hello") // "olleh"</code></pre> </section> <section id="clean"> <h3>clean</h3> <p>Removes extra whitespace from a string.</p> <pre><code class="language-typescript">clean(" hello world ") // "hello world"</code></pre> </section> <section id="pluralize"> <h3>pluralize</h3> <p> The <code>pluralize</code> function adjusts a word to its plural form based on the provided count or a custom plural form. It is particularly useful for dynamically generating grammatically correct text based on quantities. </p> <h4>Examples:</h4> <pre><code class="language-typescript">pluralize("cat", 1) // "cat" pluralize('cat', 2) // 'cats' pluralize('box', 2) // 'boxes' pluralize('baby', 2) // 'babies' pluralize('person', 1, 'people') // 'person' pluralize('person', 2, 'people') // 'people' pluralize("person", undefined, "people") // "people"</code></pre> <h4>Scenarios:</h4> <ul> <li>Displaying item counts in a shopping cart with correct singular or plural forms.</li> <li>Generating user-friendly messages in applications, such as "1 new message" vs. "5 new messages".</li> <li>Handling irregular plural forms in internationalized applications.</li> </ul> </section> <section id="toUpperCase"> <h3>toUpperCase</h3> <p>Converts a string to uppercase with optional locale support.</p> <pre><code class="language-typescript">toUpperCase("hello") // "HELLO"</code></pre> </section> <section id="toLowerCase"> <h3>toLowerCase</h3> <p>Converts a string to lowercase with optional locale support.</p> <pre><code class="language-typescript">toLowerCase("HELLO") // "hello"</code></pre> </section> <section id="chopStart"> <h3>chopStart</h3> <p>Removes a specified number of characters from the start of a string.</p> <pre><code class="language-typescript">chopStart("hello", 2) // "llo"</code></pre> </section> <section id="chopEnd"> <h3>chopEnd</h3> <p>Removes a specified number of characters from the end of a string.</p> <pre><code class="language-typescript">chopEnd("hello", 2) // "hel"</code></pre> </section> <section id="contains"> <h3>contains</h3> <p> The <code>contains</code> function checks if a given substring exists within a string. It can be configured to perform case-sensitive or case-insensitive searches, making it versatile for various text processing tasks. </p> <h4>Examples:</h4> <pre><code class="language-typescript">contains("Hello World", "world", true) // false contains("Hello World", "world", false) // true contains("Hello World", "lo") // true</code></pre> <h4>Scenarios:</h4> <ul> <li>Searching for keywords within user-generated content or documents.</li> <li>Implementing basic search functionality in applications.</li> <li>Validating input by checking for the presence of specific substrings.</li> </ul> </section> <section id="exactly"> <h3>exactly</h3> <p>Checks if two strings match exactly.</p> <pre><code class="language-typescript">exactly("Hello", "hello", false) // true</code></pre> </section> <section id="trim"> <h3>trim</h3> <p>Removes leading and trailing whitespace from a string.</p> <pre><code class="language-typescript">trim(" Hello ") // "Hello"</code></pre> </section> <section id="explode"> <h3>explode</h3> <p>Splits a string into an array of characters.</p> <pre><code class="language-typescript">explode("Hello,World", ",") // ["Hello", "World"] explode("Hello,World,Again", ",", 2) // ["Hello", "World,Again"] explode("Hello,World,Again", ",", 3) // ["Hello", "World", "Again"] </code></pre> </section> <section id="toUnicodes"> <h3>toUnicodes</h3> <p>Converts a string into its Unicode escape sequence representation.</p> <pre><code class="language-typescript">toUnicodes("Hello"); //"\u{0048}\u{0065}\u{006C}\u{006C}\u{006F}" toUnicodes("Hi 😀"); //" \u{0048}\u{0069}\u{0020}\u{1F600}" toUnicodes("Hello", "He"); // "He\u{006C}\u{006C}\u{006F}" toUnicodes("Hi 😀", ["H", "i"]); // "Hi\u{0020}\u{1F600}"</code></pre> </section> <section id="toHtmlEntities"> <h3>toHtmlEntities</h3> <p>Converts a string into its HTML Entities representation.</p> <pre><code class="language-typescript">toHtmlEntities("Hello"); // "&amp;#72;&#101;&amp;#108;&amp;#108;&amp;#111;" toHtmlEntities('Hi 😀'); // "&amp;#72;&amp;#105;&amp;#32;&amp;#128512;" toHtmlEntities("Hello", "He"); // "He&amp;#108;&amp;#108;&amp;#111;" toHtmlEntities("Hi 😀", ["H", "i"]); // "Hi&amp;#32;&amp;#128512;"</code></pre> </section> <section id="swapCase"> <h3>swapCase</h3> <p> Swaps the case of each alphabetic character in a string. Uppercase letters are converted to lowercase, and lowercase letters to uppercase. Non-alphabetic characters remain unchanged. </p> <pre><code class="language-typescript">swapCase("Hello World"); // "hELLO wORLD" swapCase("JavaScript"); // "jAVAsCRIPT" swapCase("123 ABC!"); // "123 abc!" swapCase(""); // ""</code></pre> </section> </section> <section id="array-manipulation"> <h2>Array Manipulation</h2> <p>Functions for manipulating and working with arrays.</p> <section id="removeDuplicates"> <h3>removeDuplicates</h3> <p>Removes duplicate elements from an array.</p> <pre><code class="language-typescript">removeDuplicates([1, 2, 2, 3, 4, 4, 5]) // [1, 2, 3, 4, 5]</code></pre> </section> <section id="flattenArray"> <h3>flattenArray</h3> <p>Flattens a nested array into a single level array.</p> <pre><code class="language-typescript">flattenArray([1, 2, [3, 4], [5, 6]]) // [1, 2, 3, 4, 5, 6]</code></pre> </section> <section id="filterArray"> <h3>filterArray</h3> <p>Filters an array based on a predicate function.</p> <pre><code class="language-typescript">filterArray([1, 2, 3, 4, 5], (num) => num % 2 === 0) // [2, 4] filterArray([1, 2, 3, 4, 5, 6, 7, 8], (num) => num % 2 !== 0) // [1, 3, 5, 7] filterArray([1, 2, 3, 4, 5, 6, 7, 8], (num) => num > 4) // [5, 6, 7, 8] filterArray([1, 2, 3, 4, 5, 6, 7, 8], (num) => num <= 4) // [1, 2, 3, 4]</code></pre> </section> <section id="transformArray"> <h3>transformArray</h3> <p>Transforms an array by applying a function to each element.</p> <pre><code class="language-typescript">transformArray([1, 2, 3], (num) => num * 2) // [2, 4, 6]</code></pre> </section> <section id="capitalizeEach"> <h3>capitalizeEach</h3> <p>Capitalizes the first letter of each word in each string within an array.</p> <pre><code class="language-typescript">capitalizeEach(["hello world", "typescript rocks"]) // ["Hello World", "Typescript Rocks"]</code></pre> </section> <section id="implode"> <h3>implode</h3> <p>Converts an array into a comma-separated string.</p> <pre><code class="language-typescript">implode([1, 2, 3]) // "1,2,3" implode(["Hello", "World"], " ") // "Hello World" implode(["Hello", "World"], ", ") // "Hello, World" </code></pre> </section> </section> <section id="object-manipulation"> <h2>Object Manipulation</h2> <p>Functions for manipulating and working with objects.</p> <section id="removeEmptyKeysEntries"> <h3>removeEmptyKeysEntries</h3> <p>Removes empty keys and entries from an object.</p> <pre><code class="language-typescript">const input = { a: 1, b: null, c: undefined, d: '', e: [], f: {}, g: 0, h: 'value', i: [1, 2, 3], } const expectedOutput = { a: 1, g: 0, h: 'value', i: [1, 2, 3], } expect(removeEmptyKeysEntries(input)).toEqual(expectedOutput) // true</code></pre> </section> <section id="objectToQueryString"> <h3>objectToQueryString</h3> <p>Converts an object, array of key-value pairs (matrix), or a flat array of alternating keys and values into a URL query string. <br> The function can handle different input formats: <br> - A plain object (Record &lt;string, any&gt;), <br> - A matrix (an array of arrays, where each sub-array has two elements representing a key-value pair), <br> - A flat array with an even number of elements, where each even-indexed element is a key, and the following odd-indexed element is its corresponding value.</p> <pre><code class="language-typescript">// Using a plain object objectToQueryString({ key1: 'value1', key2: 'value2' }); // Returns: "key1=value1&key2=value2" // Using a matrix (array of key-value pairs) objectToQueryString([['key1', 'value1'], ['key2', 'value2']]); // Returns: "key1=value1&key2=value2" // Using a flat array objectToQueryString(['key1', 'value1', 'key2', 'value2']); // Returns: "key1=value1&key2=value2" // Throws an error for an invalid array format objectToQueryString([['key1', 'value1'], 'invalid']); // Throws: Error: Invalid array format: Expected either an array of key-value pairs (matrix) or a flat array with an even number of elements. // Throws an error for an empty object / array objectToQueryString([]); objectToQueryString({}); // Throws: Error: Invalid input format: Expected a non-empty object or a valid array format.</code></pre> </section> <section id="objectFilterByKeys"> <h3>objectFilterByKeys</h3> <p>Filters an object by keys and returns a new object with only the specified keys.</p> <pre><code class="language-typescript">const input = { a: 1, b: 2, c: 3, d: 4, } const keys = ['a', 'b'] const expectedOutput = { a: 1, b: 2, } const output = objectFilterByKeys(input, keys) expect(output).toEqual(expectedOutput) // true</code></pre> </section> </section> <section id="deep-manipulation"> <h2>Deep Manipulation</h2> <p>Functions for deep manipulation and working with objects, strings, and arrays recursively.</p> <section id="deepClone"> <h3>deepClone</h3> <p>Creates a deep copy of an object. It handles nested objects, arrays, dates, and other complex structures.</p> <pre><code class="language-typescript">deepClone({ a: 1, b: { c: 2 } }) // { a: 1, b: { c: 2 } } deepClone([1, { a: 2 }]) // [1, { a: 2 }] deepClone(new Date(2024, 11, 20)) // Date object with the same date deepClone(object) // Deep copy of the object deepClone([{ a: 1 }, { b: 2 }]) // [{ a: 1 }, { b: 2 }] deepClone({ a: [1, 2, { b: 3 }] }) // { a: [1, 2, { b: 3 }] } </code></pre> </section> <section id="deepCompare"> <h3>deepCompare</h3> <p>Compares two objects deeply and returns either true or false based on equality. Optionally, returns an object containing the differences.</p> <pre><code class="language-typescript">deepCompare = (originalObject: any, toCompareObject: any, returnChanges: boolean = false): boolean | object => {} // Example 1: Objects are equal const obj1 = { a: 1, b: { c: 2 } } const obj2 = { a: 1, b: { c: 2 } } deepCompare(obj1, obj2) // true deepCompare(obj1, obj2, true) // {} // Example 2: Objects are not equal const obj1 = { a: 1, b: { c: 2 } } const obj2 = { a: 1, b: { c: 3 } } deepCompare(obj1, obj2, true) // { b: { c: 3 } } deepCompare(obj1, obj2) // false // Example 3: Comparing arrays const arrayWithObject1 = [{ id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }] const arrayWithObject2 = [{ id: 1, name: 'Alice' }, { id: 2, name: 'Charlie' }] deepCompare(arrayWithObject1, arrayWithObject2, true); // [{ id: 2, name: 'Charlie' }] deepCompare(arrayWithObject1, arrayWithObject2) // false // Example 4: Comparing nested objects const nestedObj1 = { users: [{ id: 1, name: 'Alice' }], settings: { theme: 'dark' } }; const nestedObj2 = { users: [{ id: 1, name: 'Alice' }], settings: { theme: 'light' } }; // Return true if objects are equal deepCompare(nestedObj1, nestedObj2) // false // Returns an object with the differences deepCompare(nestedObj1, nestedObj2, true); // { settings: { theme: 'light' } } </code></pre> </section> <section id="deepMerge"> <h3>deepMerge</h3> <p>Merges two objects recursively, overwriting values in the first object with values from the second objects or arrays.</p> <pre><code class="language-typescript">deepMerge({ a: 1, b: { c: 2 } }, { b: { d: 3 } }) // { a: 1, b: { c: 2, d: 3 } } deepMerge({ a: 1 }, { b: 2 }) // { a: 1, b: 2 } deepMerge({ a: 1 }, { a: 2 }) // { a: 2 } deepMerge({ a: { b: 1 } }, { a: { c: 2 } }) // { a: { b: 1, c: 2 } } deepMerge({ arr: [1, 2, 3] }, { arr: [3, 4, 5] }) // { arr: [1, 2, 3, 4, 5] } // Exclude keys deepMerge( { a: 1, b: 2 }, { c: 3, d: 4, e: 5 }, ['d', 'e']) // { a: 1, b: 2, c: 3 } </code></pre> </section> <section id="deepSortAlphabetical"> <h3>deepSortAlphabetical</h3> <p>Sorts an object or array alphabetically by key.</p> <pre><code class="language-typescript">deepSortAlphabetical({ a: 1, b: 2, c: 3 }) // { a: 1, b: 2, c: 3 } deepSortAlphabetical([1, 2, 3]) // [1, 2, 3] // Example with nested objects deepSortAlphabetical({ c: { d: 4, a: 1 }, b: 2 }) // { b: 2, c: { a: 1, d: 4 } } deepSortAlphabetical([{ b: 2 }, { a: 1 }