超火js库: Lodash API例子

lodash.js是一款超火的js库,在npm上均匀周下载量达到了惊人的
12,374,096,github start
36K!大批框架都用到了lodash,包含具有
123kstart的vue

本文对照lodash英文文档,加上一些小栗子和个人的履历~~,希望能帮到你们

lodash采用了immutable的头脑,永久不会转变原数据,而是会返回一个新的效果

String 字符串操纵

camelCase 转换驼峰定名

_.camelCase([string=''])

console.log(_.camelCase('Foo Bar'))
// => 'fooBar'

console.log(_.camelCase('--foo-bar--'))
// => 'fooBar'

console.log(_.camelCase('__FOO_BAR__'))
// => 'fooBar'

console.log(_.camelCase('/\__FOO_BAR__*\9'))
// 'fooBar9'

console.log(_.camelCase('fooBarbar_bar'))
// fooBarbarBar

字符串中非数字和字母都会被过滤掉,然后再转换为驼峰

capitalize 转换大写

_.capitalize([string=''])

console.log(_.capitalize('FRED'));
// => 'Fred'

遐想: 同string.prototype.toLocaleUpperCase();

deburr 清算标记

_.capitalize([string=''])

deburr转换 Latin-1 SupplementLatin Extended-A 为平常拉丁字母而且移除变音标记

_.deburr('déjà vu');
// => 'deja vu'

平常用不到…

endsWith 推断是不是是某个字符串末端

_.endsWith([string=''], [target], [position=string.length])

console.log(_.endsWith('abcdef3', 'c', 3))
// true
console.log(_.endsWith('abcdef3', 'c', 2))
// false

主假如第三个参数,不填示意搜检全部字符串,有值代表从左截取几个字符,从截取的字符中举行推断

ECMAScript 6中已到场string.prototype.endsWith()要领

escape 转义html实体字符

_.escape([string=''])

会将
&装换成
&amp,
< ->
&lt,
> ->
&gt
'' ->
&quot。其他转义字符,如:
×(乘号),÷(除号)等不会转义,请用
he如许的专业处置惩罚转义的库

console.log(_.escape(`a  as <a> &'"" *`))
// a  as &lt;a&gt; &amp;&#39;&quot;&quot; *

escapeRegExp 转义正则表达式特别字符

_.escapeRegExp([string=''])

正则表达式中的特别字符都会加”处置惩罚

console.log(_.escapeRegExp('[lodash](https://lodash.com...\\\\/)'))
// \[lodash\]\(https://lodash\.com\.\.\.\\\\/\)

kebabCase 转换成kebabCase花样

总结: 存在四种case花样

  • CamelCase: TheQuickBrownFoxJumpsOverTheLazyDog
  • SnakeCase: the_quick_brown_fox_jumps_over_the_lazy_dog
  • KebabCase: the-quick-brown-fox-jumps-over-the-lazy-dog
  • Studlycaps: tHeqUicKBrOWnFoXJUmpsoVeRThElAzydOG

检察case的详细文档

其他转换case语法通
camelCase

lowerCase 转换小写

_.lowerCase([string=''])

_.lowerCase('--Foo-Bar--');
// => 'foo bar'
 
_.lowerCase('fooBar');
// => 'foo bar'
 
_.lowerCase('__FOO_BAR__');
// => 'foo bar'

capitalize

遐想: string.prototype.toLocaleLowerCase

lowerFirst 转换第一个字符为小写

console.log(_.lowerFirst('DS'))
// dS
console.log(_.lowerFirst('__DS'))
// __DS

没法过滤非字母字符

pad 添补字符

_.pad([string=''], [length=0], [chars=' '])
有三个参数: 原字符串,长度,添补字符

假如原字符串长度短于给定的长度,则原字符串摆布双方会添补指定字符(默以为空格),假如不能均匀分配则会被截断。

_.pad('abc', 8);
// => '  abc   '
 
_.pad('abc', 8, '_-');
// => '_-abc_-_'
 
_.pad('abc', 3);
// => 'abc'

padEnd 在末端处添补字符

_.padEnd([string=''], [length=0], [chars=' '])

假如原字符串长度短于给定的长度,则原字符串右侧会添补指定字符(默以为空格),假如添补字符超越长度则会被截断

_.padEnd('abc', 6);
// => 'abc   '
 
_.padEnd('abc', 6, '_-');
// => 'abc_-_'
 
_.padEnd('abc', 3);
// => 'abc'

padStart 在最先处添补字符

_.padStart([string=''], [length=0], [chars=' '])

假如原字符串长度短于给定的长度,则原字符串左侧会添补指定字符(默以为空格),假如添补字符超越长度则会被截断

_.padStart('abc', 6);
// => '   abc'
 
_.padStart('abc', 6, '_-');
// => '_-_abc'
 
_.padStart('abc', 3);
// => 'abc'

parseInt 剖析字符串为数字

parseInt(string, radix);

string
要被剖析的值。假如参数不是一个字符串,则将其转换为字符串(运用 ToString 笼统操纵)。字符串开首的空白符将会被疏忽。
radix
一个介于2和36之间的整数(数学体系的基本),示意上述字符串的基数。比方参数”10″示意运用我们一般运用的十进制数值体系。一直指定此参数能够消弭浏览该代码时的疑心而且保证转换效果可展望。当未指定基数时,差别的完成会发生差别的效果,一般将值默以为10。

返回值: 返回剖析后的整数值。 假如被剖析参数的第一个字符没法被转化成数值范例,则返回 NaN
radix参数为n 将会把第一个参数看做是一个数的n进制示意,而返回的值则是十进制的。比方:

_.parseInt('123', 5) // 将'123'看做5进制数,返回十进制数38 => 1*5^2 + 2*5^1 + 3*5^0 = 38

完成道理es5 parseInt

repeat 反复指定字符串

_.repeat([string=''], [n=1])

反复string字符串n次, 默许1次

_.repeat('*', 3);
// => '***'
 
_.repeat('abc', 2);
// => 'abcabc'
 
_.repeat('abc', 0);
// => ''

replace 替代字符串

_.replace([string=''], pattern, replacement)

同es5 string.prototype.replace

_.replace('Hi Fred', 'Fred', 'Barney');
// => 'Hi Barney'
console.log(_.replace('Hi Fred', 'Fred', () => 'ddddd'))
// Hi ddddd

split 支解为数组

_.split([string=''], separator, [limit])

同string.prototype.split, 比es5多了第三个参数。
假如第三个参数小于数组长度,则返回对应参数长度数组,如:

_.split('a-b-c', '-', 1)
// ['a']

大于数组长度,返回底本支解的数组

_.split('a-b-c', '-', 5)
// ['a', 'b', 'c']

startsWith 推断是不是是某个字符开首

MDN: string.prototype.startsWith

想造福人类来着的,效果晚了… @小呆 https://www.css88.com/doc/lodash

    原文作者:ddsdchdsd
    原文地址: https://segmentfault.com/a/1190000017540521
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞