今天小编要跟大家分享的文章是关于Web前端工程师要掌握的JavaScript代码片段(一)。正在从事web前端工作的小伙伴们来和小编一起看一看吧,希望本篇文章能够对正在从事web前端工作的小伙伴们有所帮助。
1、Anagramsofstring(带有重复项)
使用递归。对于给定字符串中的每个字母,为字母创建字谜。使用map()将字母与每部分字谜组合,然后使用reduce()将所有字谜组合到一个数组中,最基本情况是字符串长度等于2或1。
constanagrams=str=>{
if(strlength[str];
returnstrsplit('')reduce((acc,letter,i)=>
accconcat(anagrams(strslice(0,i)+strslice(i+1))map(val=>
letter+val)),[]);
};
//anagrams('abc')->['abc','acb','bac','bca','cab','cba']
2、数组平均数
使用reduce()将每个值添加到累加器,初始值为0,总和除以数组长度。
constaverage=arr=>arrreduce((acc,val)=>acc+val,0)/
arrlength;
//average([1,2,3])->2
3、大写每个单词的首字母
使用replace()匹配每个单词的第一个字符,并使用toUpperCase()来将其大写。
constcapitalizeEveryWord=str=>strreplace(/\b[a-z]/g,char=>
chartoUpperCase());
//capitalizeEveryWord('helloworld!')->'HelloWorld!'
4、首字母大写
使用slice(0,1)和toUpperCase()大写第一个字母,slice(1)获取字符串的其余部分。省略lowerRest参数以保持字符串的其余部分不变,或将其设置为true以转换为小写。(注意:这和上一个示例不是同一件事情)
constcapitalize=(str,lowerRest=false)=>
strslice(0,1)toUpperCase()+(lowerReststrslice(1)toLowerCase():
strslice(1));
//capitalize('myName',true)->'Myname'
5、检查回文
将字符串转换为toLowerCase(),并使用replace()从中删除非字母的字符。然后,将其转换为tolowerCase(),将('')拆分为单独字符,reverse(),join(''),与原始的非反转字符串进行比较,然后将其转换为tolowerCase()。
constpalindrome=str=>{
consts=strtoLowerCase()replace(/[\W_]/g,'');
returns===ssplit('')reverse()join('');
}
//palindrome('tacocat')->true
6、计数数组中值的出现次数
每次遇到数组中的特定值时,使用reduce()来递增计数器。
constcountOccurrences=(arr,value)=>arrreduce((a,v)=>v===
valuea+1:a+0,0);
//countOccurrences([1,1,2,1,2,3],1)->3
7、当前URL
使用windowlocationhref来获取当前URL。
constcurrentUrl=_=>windowlocationhref;
//currentUrl()->'>
如果前端集合的对象是通过AJAX请求发送到后端的,那么在后端可以通过接收请求参数的方式获取对象的值。
如果前端集合的对象是通过AJAX请求发送到后端的,那么在后端可以通过接收请求参数的方式获取对象的值。
例如,如果前端通过AJAX请求发送了如下数据:
{
"name": "John",
"age": 30,
"hobbies": ["music", "sports"]
}
那么在后端可以通过如下代码获取对象的值:
// 获取请求参数
const data = requestgetParameterMap()
// 获取对象的值
const name = dataget('name')
const age = dataget('age')
const hobbies = dataget('hobbies')
// 输出对象的值
consolelog(name) // John
consolelog(age) // 30
consolelog(hobbies) // ["music", "sports"]
上面的代码通过requestgetParameterMap方法获取请求参数,然后通过get方法获取对象的属性值。
var oMenu = documentgetElementById('menu');//根据ID获取menu
var aH2 = oMenugetElementsByTagName('h2');//获取所有h2标签
var aUl = oMenugetElementsByTagName('ul');//获取所有ul标签
for(var i=0; i<aH2length; i++){//根据H2标签的长度开始循环
aH2[i]index = i;//这一句是设置当前H2标签的索引
aH2[i]onclick = function(){//这一句是为当前的H2标签添加点击事件
for(var i=0; i<aUllength; i++){//H2被点击后,开始根据aUL的长度开始循环
if(i==thisindex){//i等于当前UL标签的索引
if(aUl[thisindex]styledisplay == 'block'){//如果当前的UL是显示状态
aUl[thisindex]styledisplay = 'none';//设置成隐藏状态
aH2[thisindex]className="active11";//并修改H2标签的样式为active11
}else{//下面的就不解释了 很简单
aUl[thisindex]styledisplay = 'block';
aH2[thisindex]className="active";
}
}else{
aUl[i]styledisplay = 'none';
aH2[i]className="active11";
一、基于<meta>标签获取博客描述
1、在博客页面中,在<head>标签内添加<meta>标签,添加name属性为“description”,添加content属性为博客描述;
2、通过php函数get_meta_tags()获取<meta>标签中name为“description”的属性值;
3、此方法可以在服务器端完成,通过php代码获取博客描述,然后在前端页面中显示。
二、基于标题获取博客描述
1、利用php的DOM函数解析博客页面,获取h1标签的文本内容;
2、利用php的字符串 *** 作函数,将h1标签文本内容截取,生成博客描述;
3、此方法获取博客描述可以在服务器端完成,通过php代码获取博客描述,然后在前端页面中显示。
以上就是关于Web前端工程师要掌握的JavaScript代码片段(一)全部的内容,包括:Web前端工程师要掌握的JavaScript代码片段(一)、PHP echo json_encode()后前端是怎么获取数据的。获取后又怎么处理。、前端集合的对象的值在后端怎么取等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)