javascript练习笔记整理·1-6.23

omoc      2022-02-11     451

关键词:

练习平台Codewars地址:https://www.codewars.com/
欢迎和大家一起来讨论~╭( ・ㅂ・)و ̑̑
 
基础练习(1):
 

我的解答为:

class SmallestIntegerFinder {
  findSmallestInt(args) {
    var a = args[0];
    for(var i=0; i<args.length; i++){
      if(args[i] <= a){
        a = args[i];
      }
    }
    return a;
  }
}

较优解答为:

class SmallestIntegerFinder {
  findSmallestInt(args) {
    return Math.min.apply(null, args);
  }
}

分析:

可以看出我所想到使用的方法仍处于比较初级的阶段,没有想到用Math对象的方法实现。使用方法可以减少代码量,更简洁。也说明了对于常用方法这部分的内容还不熟练。

笔记:

Math.min()方法和Math.max()方法的作用是用于确定一组数值中的最小值和最大值。可以接收任意多个数值参数。
 
apply()方法的作用是在特定的作用域中调用函数,相当于设置函数体内thisUI想的值。apply()方法接收两个参数:一个是在其中运行函数的作用域,另一个是参数数组。
相似的另一个方法call()方法,与apply()方法有同样的作用,区别在于接收参数的方式不同。call()方法接收的第一个参数也为this值,其余参数都直接传递给函数,传递给函数的参数必须逐个列举出来。
apply()方法和call()方法能够扩充函数运行的作用域,并且对象不需要与方法有任何耦合关系。
 
高程中两个方法结合使用得出最值的例子:
var values = [1,2,3,4,5,6,7,8];
var max = Math.max.apply(Math,values);
 
Math.min(...args)
JavaScript中的新特性,扩展语法( spread syntax),在对象前加上...的前缀,即可遍历对象。
 

 基础练习(2)

我的解答为:

function removeSmallest(numbers) {
  var lowest = Math.min.apply(Math,numbers);
  var index = numbers.indexOf(lowest);
  numbers.splice(index,1);
  return numbers;
}

较优解答为:

function removeSmallest(numbers) {
  if(!numbers)return [];
  var min=Math.min.apply(null,numbers);
  numbers.splice(numbers.indexOf(min),1);
  return numbers;
}

分析:

思路都是使用Math.min.apply()方法求出最小值,再使用indexOf()方法求出该最小值在数组中的索引值,最后通过splice()方法,通过设置索引值和删除的项数来删除该最小值。不同的一点是,在执行这一些列的操作前,先判断数组是否为空,若为空则直接返回一个空数组。

笔记:

indexOf()方法返回要查找的项在数组中的位置,或者在没有找到的情况下返回-1,接收两个参数:要查找的项和表示查找起点位置的索引(可选)。indexOf()方法表示从数组开头开始向后查找,而lastindexOf()方法则从数组的末尾开始向前查找。
 
splice()方法的主要用途是想数组的中部插入项,但使用该方法的方式有三种,分别为删除、插入和替换。splice()方法始终返回一个数组,该数组中包含从原始数组中删除的项,若没有删除项则返回一个空数组。该方法会改变原数组。三个使用方式的介绍如下:
删除:可以删除任意数量的值,指定两个参数:要删除的第一项的位置和要删除的项数。
插入:可以向指定位置插入任意数量的项,需要提供三个参数:起始位置、要删除的项数(一般为0)和要插入的项。
替换:可以向指定位置插入任意数量的项,且同时删除任意数量的项,需指定三个参数:起始位置、要删除的项数和要插入的任意数量的项。
 

 基础练习(3)

 我的解答为:

function squareDigits(num) {
  var arr = num.toString().split("");
  var newarr = arr.map(function(item,index,array) {
    return Math.pow(item,2);
  });
  var newnum = Number(newarr.join(""));
  return newnum;
}

较优解答为:

function squareDigits(num){
  return Number((' ' + num).split('').map(function (val) { return val * val;}).join(' '));
}

分析:

相比之下,较优解一般喜欢使用一条语句得出答案,此外使用的方法都是相类似的。其中将数值型数据转为字符型数据时,他使用的是弱类型转换。而后在计算平方时,使用的方法是直接相乘,我觉得不利于日后的代码修改的,比如说改为任意次方?,所以我觉得使用Math.pow()方法会比较好一些。

笔记:

split()方法可以基于指定的分隔符将一个字符串分割成多个子字符串,并将结果放在一个数组中。分隔符可以是字符串也可是一个RegExp对象。可接收可选的第二个参数,用于指定数组的大小,以便确保返回的数组不会超过既定大小。
 
map()方法是对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组,该数组的每一项都是在原始数组中的对应项上运行传入函数的结果。相似的迭代方法还有every()、filter()、forEach()和some()。
 
Math.pow()方法,接收两个参数:num和power,返回num的power次幂。
 
join()方法可以使用不同的分隔符来构建字符串,只接收一个参数,用作分隔符的字符串,后返回包含所有数组向的字符串。若不给join()方法传入任何值,或传入undefined,则使用逗号作为分隔符。
 

今日总结:
之前也有在FreeCodeCamp里练习,与Codewars不同的是FreeCodeCamp比较基础,做练习的时候有相应的方法提示,不需要思考就可以根据所给的方法进行测试,所以仅仅知道这些方法的存在而在用的时候很难想起来噢原来可以这样用或者是这个方法具体是怎么用。而在Codewars完全是只有题目,靠自己的思考解答,而且解答以后可以看到其他人的比较好的答案。为了解答题目的过程,翻书网上找资料,最后一点一点从错误到正确,还是蛮有成就感的。通过比较自己和被人的答案也可以知道怎么解答会更好一些。最后再把方法总结一遍,也就能记住了。
 
 

javascript练习笔记整理·4-6.26

基础练习(1):我的解答为:functiongetMiddle(s){if(s.length%2==0){returns.charAt(s.length/2-1)+s.charAt(s.length/2);}else{returns.charAt(s.length/2);}}较优解答为:functiongetMiddle(s){returns.substr(Math.ceil(s.length/2 查看详情

javascript练习笔记整理·3-6.25

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

菜鸟的javascript自学笔记整理(代码片段)

整理学习了JavaScript的相关知识,因为笔者学过C++,所以感觉上手javascript比较容易,故本博文整理了一些JavaScript的特殊之处。(虽然笔者还没有学习过java,但是我知道它两应该是老婆和老婆饼的关系。)... 查看详情

笔记得到-《梁宁·产品思维三十讲》

...三十讲】,感觉很棒,抽时间听完了所有的课程,特整理笔记如下。 01发刊词|产品能力是每个人的底层能力产品能力就是训练一个人:判断信息,抓住要点,整合有限的资源,把自己的价值打包成一个产品向世界交付,并且... 查看详情

maven笔记整理(代码片段)

maven笔记粗整目录1.Maven介绍1.1.过去开发过程中的问题1.2.什么是Maven1.3.Maven解决的问题1.4.Maven的作用1.4.1.依赖管理1.4.2.一键构架1.5.Maven下载1.6.Maven工程的包的介绍1.7.Maven的使用2.maven的仓库介绍2.1.maven中导入坐标的方式2.2.仓库的分... 查看详情

javascript进阶篇——(javascript内置对象---下)--math对象---笔记整理

Math对象使用Math的属性和方法:<scripttype="text/javascript">varmypi=Math.PI;varmyabs=Math.abs(-15);document.write(mypi);document.write(myabs);</script>运行结果:3.14159265358979315Math对象是一个固有的对象,无需创建它,直接把 查看详情

javascript学习笔记整理(事件)

一、事件驱动1.事件javascript侦测到的用户的操作或是页面的一些行为(怎么发生的)2.事件源引发事件的元素(发生在谁的身上)3.事件处理程序对事件处理的程序或是函数(发生了什么事)二、事件的分类1.鼠标事件onclick      ... 查看详情

《刻意练习》如何从新手到大师安德斯·艾利克森罗伯特·普尔著

...才”是训练的产物本书将告诉我们什么017第1章有目的的练习一旦某个人的表现达到了“可接受”的水平,并且可以做到自动化,那么更多“练习”几年也不会有什么进步,而且会缓慢退化。有目的的练习则更加有效史蒂夫的超... 查看详情

javascript学习笔记整理day11

一.词边界、正向预查、反向预查  1.词边界    词边界(单词的边界)    B非词边界     //匹配出第二个hellovarstr=‘hellobabyhello‘;varreg=/hello/;console.log(str.match(reg));//匹配出第一个hellovarreg=/helloB/;console.log(str.m... 查看详情

《javascript高级程序设计》第六章笔记整理

一、创建对象的方法(6种)  1.工厂模式  即用函数来封装以特定接口创建对象的细节。functioncreatePerson(name,age,job){varo=newObject();o.name=name;o.age=age;o.job=job;o.sayName=function(){alert(this.name);}returno;}varperson1=createPerson(‘ 查看详情

javascript学习笔记整理day9

一.JavaScript定时器:  1.单次定时:setTimeout(fn,time);  2.多次定时:setInterval(timer);  3.停止单次定时:clearTimeout(timer);  4.停止多次定时:clearInterval(timer);实例1:使用单次和多次定时写倒计时<!doctypehtml><htmllang="en"><... 查看详情

javascript学习笔记整理day15

...5.Navigator一.window  window概述:    1.window是客户端JavaScript的全局对象    2.它表示web浏览器的一个窗口或窗体,并且用标识符window来引用  1.innerHeight 返回窗口的文档显示区高度IE9以下不兼容  2. 查看详情

使用javascript·求数组的最大值和最小值

前言 在数组中并没有提供arr.max()和arr.min()这样的方法。那么是不是可以通过别的方式实现类似这样的方法呢?那么今天我们就来整理取出数组中最大值和最小值的一些方法。 法一:其实利用ECMAScript5的...展开运算符可以... 查看详情

练习·1

<?php//打开文件//$fp=foper("aaa.txt","r");//echo"ok";//1.判断文件是否存在//2.绝对路径和相对路径if(file_exists("aaa.txt")){echo"文件不存在!"exit();}else{$fp=foper("aaa.txt","r");echo"文件打开成功";//....关闭fclose($fp);}?><?ph 查看详情

javascript学习笔记整理day14

一.Scroll事件  ---元素内部内容的滚动  1.有滚动条的元素 box.onscroll=function(){//获取滚动距离--内容的滚动  varscroll_left=this.scrollLeft;//往左的滚动距离  varscroll_top=this.scrollTop;//往上的滚动距离console.log(scroll_left,scroll_... 查看详情

javascript学习笔记整理(dom对象)

DOM--document(htmlxml)objectmodle,document对象(DOM核心对象),document对象是Window对象的一部分,可通过window.document属性对其进行访问,document对象使我们可以从脚本中对HTML页面中的所有元素进行访问1.属性title--返回或设置当前文档的标题... 查看详情

javascript学习笔记整理(正则)

RegExp对象表示正则表达式,它是对字符串执行模式匹配的强大工具varre=/e/;varre=newRegExp(‘e‘);正则表达式的String对象的方法1.search---检索与正则表达式相匹配的值(返回值得下标)vara=‘a1a34b4cd5ef5g‘;alert(a.search(‘a‘));结果:0alert(a.... 查看详情

javascript学习笔记整理(window对象)

浏览器对象模型(BOM--BrowserObjectModel),window对象是BOM中所有对象的核心A、属性1.(位置类型-获得浏览器的位置)IE:window.screenLeft   获得浏览器距屏幕左上角的左边距 window.screenTop   获得浏览器距屏幕左上角... 查看详情