0

0

分享JavaScript练习的实例教程

零下一度

零下一度

发布时间:2017-06-27 10:22:35

|

1697人浏览过

|

来源于php中文网

原创

欢迎和大家一起来讨论~
 
基础练习(1):
 
我的解答为:
function array_diff(a, b) {  if (b == "") return a;  return a.filter(function(item,index,array) {var flag = false;for(var i=0;i<b.length;i++) {      if(item !== b[i]) flag = true;
    }return flag;
  });
}

较优解答为:

立即学习Java免费学习笔记(深入)”;

function array_diff(a, b) {  return a.filter(function(x) { return b.indexOf(x) == -1; });
}

 

分析:

微厦在线学习云服务平台2.0.0
微厦在线学习云服务平台2.0.0

微厦在线学习云服务平台 2.0是一款基于B/S架构的在线教育系统,将“在线视频学习、在线试题练习、在线同步考试”紧密相联,打造“学、练、考”于一体的在线教育系统,能够利用电脑、手机、微信等多种设备进行学习,方便学员利用碎片化时间进行随时随地的学习。并带有“分享、分润、分销”的辅助功能,对于平台推广、课程销售起到非常有效的帮助。适用类别:个人、单位、老师、大学、教育机构适用行业:企业培训、教育机构、

下载
对数组a使用filter()方法,迭代判断数组a中的值是否存在于数组b中。当x的值,即数组a的值不能在数组b中找到时,b.indexOf()方法将返回-1。数组的filter()方法是指对数组中的每一项运行给定函数,返回该函数会返回true的项组成的的数组。
我的思路就稍微想得复杂了,对数组进行迭代的方法filter()是想到了,却没有好好地利用起来,函数内的判断方法不够简洁,也没有想到可以使用indexOf()方法进行判断。
 

笔记:

filter()方法,是指对数组中的每一项运行给定函数,返回该函数会返回true的项组成的的数组。利用指定的函数确定是否在返回的数组中包含某一项。
 
使用例子:
var numbers = [1,2,3,4,5,4,3,2,1];
var filterResult = numbers.filter(function(item,index,array) {
     return (item>2);
});
alter(filterResult); //[3,4,5,4,3]
 
数组的迭代方法真的很常用的,用于对某个数组循环某一操作。这些迭代方法要比for循环语句简单很多,要记住!
共有五个迭代方法:every()、filter()、forEach()、map()、some()。
 

基础练习(2):
 

我的解答为:
var gimme = function (inputArray) {  var newArray = [];  for(var i=0;i<inputArray.length;i++) {
    newArray[i] = inputArray[i];
  }
  newArray.sort(function(a,b) {if(a < b) {      return -1;
    } else if (a> b) {return 1;
    } else {return 0;
    }
  });  return inputArray.indexOf(newArray[1]);
};

较优解答为:

立即学习Java免费学习笔记(深入)”;

function gimme(a) {  return a.indexOf(a.concat().sort(function(a, b) { return a - b })[1])
}

 

分析:

在较优解答中,对原数组使用了concat()方法,该方法可以将原数组复制并创建一个新数组。接着对新数组进行排序,并对于中间值求得索引值。
我的思路和最优解是一样的,而实现方法还是稚嫩了一些。对于创建新数组不知道可以使用concat()方法进行快速地复制,也说明对基础知识的熟悉程度不够了。另外排序方法中,原来可以直接使用“return a-b”,我的方法就显得很累赘了。
 

笔记:

concat()方法可基于当前数组中的所有项创建一个新数组。该方法会先创建当前数组的一个副本,将接收到的参数添加到这个副本的末尾,最后返回新构建的数组。在没有给concat()方法传递参数的情况下,它只是复制。若传递给concat()方法的是一个或多个数组,则该方法会将这些数组中的每一项都添加到结果数组中。若传递值不是数组,则添加到结果数组的末尾。
 
使用例子:
var colors = ["red","green","blue"];
var colors = colors.concat("yellow",["black","brown"]);
alert(colors); // red,green,blue
alert(colors); // red,green,blue,yellow,black,brown
 
重排序方法:使用sort()方法可以进行排序,但仍可能会出现一些问题,因此使用比较函数,可以避免这个问题。
对于大多数数据类型可使用,只需要将其作为参数传递给sort()方法即可:
function compare(value1,value2) {
     if(value1
          return -1;
     } else if (value1> value2) {
          return 1;
     } else {
          returm 0;
     }
}
对于数值型或其他valueOf()方法会返回数值类型的对象类型,可以使用更简单的比较函数:
function compare(value1,value2) {
     return value2 - value1;
}
 
基础练习(3):
 
我的解答为:
function minMax(arr){  var newarr = [];
  newarr.push(Math.min.apply(Math,arr));
  newarr.push(Math.max.apply(Math,arr));  return newarr;
}

较优解答为:

立即学习Java免费学习笔记(深入)”;

function minMax(arr){  return [Math.min(...arr), Math.max(...arr)];
}

分析:

这道题目就很简单了,较优解答中的扩展语法( spread syntax)也在练习一中提及了。我的写法还是太谨慎了,是不是应该大胆一些呢?
 
基础练习(4):
 
我的解答为:
function XO(str) {   var str = str.toLowerCase();   var countx = 0;   var counto = 0;   for(var i=0;i<str.length;i++) {     if(str[i] === "x") {
       countx++;
     }     if(str[i] === "o") {
       counto++;
     }
    }if(counto == countx) {      return true;
    } else {      return false;
    }
}

较优解答为:

立即学习Java免费学习笔记(深入)”;

function XO(str) {var a = str.replace(/x/gi, ''),
          b = str.replace(/o/gi, '');return a.length === b.length;
}

分析:

较优解使用的是replace()方法,结合正则表达式的使用,对原字符串str分别将x和o用空字符串替换得到a和b字符串,比较a和b字符串的长度,从而得到结果。我的解答方法呢,因为实在想不到可以使用什么方法,所以用的最原始的方法,仿佛自己在做C语言的题目。
 
笔记:
replace()方法,该方法接受两个参数,一个参数可以是一个RegExp对象或者一个字符串,第二个参数可以是一个字符串或者是一个函数。若第一个参数是字符串,指挥替换第一个子字符串。要想替换所有子字符串,是提供一个正则表达式,并且指定全局标志。
 
使用例子:
var text = "cat,bat,sat,fat";
var result = text.replace("at","ond");
alert(result); //"cond,bat,sat,fat"
 
result = text.replace(/at/g,"ond");
alert(result); //"cond,bond,song,fond"
 
 总结:
今天的知识点主要是数组的迭代方法中的一种filter()方法、数组操作方法中的concat()方法以及字符串的replace()方法。filter()方法可用于使用函数判断数组中各项的值中返回true值的结果所组成的数组。concat()可以复制和创建新数组。而replace()方法可以替换字符串中的一个或多个值。
从这三天的练习来看,对于数组的各种方法也逐渐使用得熟练起来了。但是其他类型的各种方法还是一种挑战。而我的解答也要从比较冗余的语句,写出更为简洁而有效的语句了。继续加油吧!
 
 

相关文章

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
漫蛙app官网链接入口
漫蛙app官网链接入口

漫蛙App官网提供多条稳定入口,包括 https://manwa.me、https

41

2026.02.27

deepseek在线提问
deepseek在线提问

本合集汇总了DeepSeek在线提问技巧与免登录使用入口,助你快速上手AI对话、写作、分析等功能。阅读专题下面的文章了解更多详细内容。

2

2026.02.27

AO3官网直接进入
AO3官网直接进入

AO3官网最新入口合集,汇总2026年可用官方及镜像链接,助你快速稳定访问Archive of Our Own平台。阅读专题下面的文章了解更多详细内容。

28

2026.02.27

php框架基础教程
php框架基础教程

本合集涵盖2026年最新PHP框架入门知识与基础教程,适合初学者快速掌握主流框架核心概念与使用方法。阅读专题下面的文章了解更多详细内容。

1

2026.02.27

php框架怎么用
php框架怎么用

本合集专为零基础学习者打造,系统介绍主流PHP框架的安装、配置与基础用法,助你快速入门Web开发。阅读专题下面的文章了解更多详细内容。

2

2026.02.27

无禁词AI聊天软件下载大全
无禁词AI聊天软件下载大全

本合集精选多款免费、无违禁词限制的AI聊天软件,支持自定义角色、剧情畅聊,体验真实互动感。阅读专题下面的文章了解更多详细内容。

6

2026.02.27

ai志愿助手2026
ai志愿助手2026

本合集汇总了2026年主流AI志愿助手官方入口及官网地址,涵盖圆梦志愿、蝶变志愿等智能填报平台,助你高效精准填志愿。阅读专题下面的文章了解更多详细内容。

1

2026.02.27

高清视频免费观看软件
高清视频免费观看软件

精选多款高清视频免费观看软件,涵盖海量电视剧、电影、综艺等资源,支持在线播放、无广告干扰、画质清晰流畅。阅读专题下面的文章了解更多详细内容。

8

2026.02.27

快看漫画地址大全
快看漫画地址大全

2026年快看漫画官方入口、APP下载地址及网页版在线阅读地址汇总,涵盖平台最新功能与热门作品推荐。阅读专题下面的文章了解更多详细内容

1

2026.02.27

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 5.5万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 3.2万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.5万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号