JavaScript数组-字符串-数学函数

这次给大家带来javascript数组-字符串-数学函数,使用javascript数组-字符串-数学函数的注意事项有哪些,下面就是实战案例,一起来看一下。

数组方法里push、pop、shift、unshift、join、split分别是什么作用。
push()方法添加一个或多个元素到数组的末尾,并返回数组新的长度(length 属性值)。
pop() 方法删除一个数组中的最后的一个元素,并且返回这个元素。
shift()方法删除数组的第一个元素,并返回这个元素。该方法会改变数组的长度。
unshift() 方法在数组的开头添加一个或者多个元素,并返回数组新的 length 值。
join()方法将数组中的所有元素连接成一个字符串。
**split() **方法通过把字符串分割成子字符串来把一个 String对象分割成一个字符串数组。

代码题

数组

用 splice 实现 push、pop、shift、unshift方法
定义和用法
splice() 方法用于插入、删除或替换数组的元素。
语法

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

arrayObject.splice(index,howmany,element1,.....,elementX)

参数描述
index 必需。规定从何处添加/删除元素。该参数是开始插入和(或)删除的数组元素的下标,必须是数字。
howmany 必需。规定应该删除多少元素。必须是数字,但可以是 “0”。如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。element1 可选。规定要添加到数组的新元素。从 index 所指的下标处开始插入。
elementX 可选。可向数组添加若干元素。
返回值
如果从 arrayObject 中删除了元素,则返回的是含有被删除的元素的数组。

splice->pushvar a = [1,2,3,4,5]var b = [1,2,3,4,5]console.log(a);console.log(b);a.push(6);b.splice(5,1,6);console.log(a);console.log(b);splice->popvar a = [1,2,3,4,5]var b = [1,2,3,4,5]console.log(a);console.log(b);a.pop();b.splice(4,1);console.log(a);console.log(b);splice->shiftvar a = [1,2,3,4,5]var b = [1,2,3,4,5]console.log(a);console.log(b);a.shift();b.splice(0,1);console.log(a);console.log(b);splice->unshiftvar a = [1,2,3,4,5]var b = [1,2,3,4,5]console.log(a);console.log(b);a.unshift(-1);b.splice(0,0,-1);console.log(a);console.log(b);

使用数组拼接出如下字符串

var prod = {    name: '女装',    styles: ['短款', '冬季', '春装']};function getTpl(data){//todo...};var result = getTplStr(prod);  //result为下面的字符串    
女装
短款
冬季
春装

代码:

var prod = {name: '女装',styles: ['短款', '冬季', '春装']};function getTplStr(data){var htmls = [];htmls.push('
','
'+data,name+'
');for(i=0;i<data.styles.length;i++){htmls.push('
'+data.styles[i]+'
')}htmls.push('
');var htmls = htmls.join('')return htmls};var result = getTplStr(prod); //result为下面的字符串console.log(result)

写一个find函数,实现下面的功能

var arr = [ "test", 2, 1.5, false ]find(arr, "test") // 0find(arr, 2) // 1find(arr, 0) // -1

代码:

var arr = [ "test", 2, 1.5, false ]var find = function(a,b){console.log(a.indexOf(b))}find(arr, "test") // 0find(arr, 2) // 1find(arr, 0) // -1

写一个函数filterNumeric,实现如下功能

arr = ["a", 1,3,5, "b", 2];newarr = filterNumeric(arr);  //   [1,3,5,2]

代码:
方法一:

arr = ["a", 1,3,5, "b", 2];var filterNumberic = function(data){var a = [];for(i=0;i<data.length;i++){if(typeof data[i] === 'number'){a.push(data[i]);}}return a}

newarr = filterNumberic(arr);  //   [1,3,5,2]
console.log(newarr)
方法二:

arr = ["a", 1,3,5, "b", 2];function isNumber(element) {return typeof element === 'number';}var newarr = arr.filter(isNumber)console.log(newarr)

对象obj有个className属性,里面的值为的是空格分割的字符串(和html元素的class特性类似),写addClass、removeClass函数,有如下功能:

var obj = {className: 'open menu'}addClass(obj, 'new') // obj.className='open menu new'addClass(obj, 'open')  // 因为open已经存在,此操作无任何办法addClass(obj, 'me') // obj.className='open menu new me'console.log(obj.className)  // "open menu new me" removeClass(obj, 'open') // obj.className='menu new me'  removeClass(obj, 'blabla')  // 不变

代码:

var obj = {className: 'open menu'}var addClass = function(a,b){var name = a.className.split(" ");if(name.indexOf(b) === -1) {name.push(b);}else{console.log("因为"+b+"已经存在,此操作无任何办法");}a.className = name.join(" ");console.log('obj.className='+a.className);}var removeClass = function(a,b){var name = a.className.split(" ");if(name.indexOf(b) !== -1){name.splice(name.indexOf(b),1)a.className = name.join(" ");console.log('obj.className='+a.className)}else{console.log('不变')}}   addClass(obj, 'new') // obj.className='open menu new'    addClass(obj, 'open')  // 因为open已经存在,此操作无任何办法    addClass(obj, 'me') // obj.className='open menu new me'    console.log(obj.className)  // "open menu new me"    removeClass(obj, 'open') // obj.className='menu new me'    removeClass(obj, 'blabla')  // 不变

写一个camelize函数,把my-short-string形式的字符串转化成myShortString形式的字符串,如:

camelize("background-color") == 'backgroundColor'camelize("list-style-image") == 'listStyleImage'

代码:

function camelize(string){return string.replace(/-/g,'')}console.log(camelize("background-color"))camelize("background-color") == 'backgroundColor'camelize("list-style-image") == 'listStyleImage'

如下代码输出什么?为什么?

arr = ["a", "b"];arr.push( function() { alert(console.log('hello hunger valley')) } );arrarr.length-1  // ?

因为arr.push( function() { alert(console.log(‘hello hunger valley’)) } );将function() { alert(console.log(‘hello hunger valley’)push到arr[]最后一位,arr[arr.length-1]()取该数组最后一位,然后立即执行该函数,由于function() { alert(console.log(‘hello hunger valley’)中console.log只允许在控制台中打开,所以结果为undefined。

写一个函数filterNumericInPlace,过滤数组中的数字,删除非数字

arr = ["a", 1,3,4,5, "b", 2];//对原数组进行操作,不需要返回值filterNumericInPlace(arr);console.log(arr)  // [1,3,4,5,2]

代码:

arr = ["a","d", 1,3,4,5, "b", 2];//对原数组进行操作,不需要返回值function filterNumericInPlace(data){for(i=0;i<data.length;i++){if(typeof data[i] === 'string'){data.splice(i,1);i--;//splice指针减少1,否则获取不了数组中全部元素。}}}filterNumericInPlace(arr);console.log(arr)  // [1,3,4,5,2]

写一个ageSort函数实现如下功能:

var john = { name: "John Smith", age: 23 }var mary = { name: "Mary Key", age: 18 }var bob = { name: "Bob-small", age: 6 }var people = [ john, mary, bob ]ageSort(people) // [ bob, mary, john ]

代码:
方法一:

function ageSort(arr){arr.sort(function(a,b){return a.age-b.age})return arr}var john = { name: "John Smith", age: 23 }var mary = { name: "Mary Key", age: 18 }var bob = { name: "Bob-small", age: 6 }var people = [ john, mary, bob ]ageSort(people) // [ bob, mary, john ]console.log(ageSort(people))

方法二:

function ageSort(a){for(i=0;i0){var b = a[i];a[i] = a[j];a[j] = b;}}}return a}var john = { name: "John Smith", age: 23 }var mary = { name: "Mary Key", age: 18 }var bob = { name: "Bob-small", age: 6 }var people = [ john, mary, bob ]ageSort(people) // [ bob, mary, john ]console.log(ageSort(people))

写一个filter(arr, func) 函数用于过滤数组,接受两个参数,第一个是要处理的数组,第二个参数是回调函数(回调函数遍历接受每一个数组元素,当函数返回true时保留该元素,否则删除该元素)。实现如下功能:

function isNumeric (el){return typeof el === 'number';}arr = ["a",3,4,true, -1, 2, "b"] arr = filter(arr, isNumeric) ; // arr = [3,4,-1, 2],  过滤出数字  arr = filter(arr, function(val) { return val > 0 });  // arr = [2] 过滤出大于0的整数

代码:

function filter(data,callback){return data.filter(callback)}   function isNumeric (el){        return typeof el === 'number';     }    arr = ["a",3,4,true, -1, 2, "b"]    arr = filter(arr, isNumeric) ; // arr = [3,4,-1, 2],  过滤出数字    console.log(arr)    arr = filter(arr, function(val) { return val > 0 });  // arr = [2] 过滤出大于0的整数    console.log(arr)

字符串

写一个 ucFirst函数,返回第一个字母为大写的字符。

ucFirst("hunger") == "Hunger"

代码:

function ucFirst(string){return string[0].toUpperCase()+string.slice(1);}console.log(ucFirst("hunger"))ucFirst("hunger") == "Hunger"

写一个函数truncate(str, maxlength), 如果str的长度大于maxlength,会把str截断到maxlength长,并加上…,如:

truncate("hello, this is hunger valley,", 10)) == "hello, thi...";truncate("hello world", 20)) == "hello world"

代码:

function truncate(str,maxlength){if(str.length>maxlength){var sub = str.substring(maxlength)str =  str.replace(sub,'...');} return str;}console.log(truncate("hello, this is hunger valley,", 10));truncate("hello, this is hunger valley,", 10) == "hello, thi...";truncate("hello world", 20) == "hello world"

数学函数

写一个函数limit2,保留数字小数点后两位,四舍五入,如:

var num1 = 3.456limit2( num1 );  //3.46limit2( 2.42 );    //2.42

代码:

var num1 = 3.456function limit2(data){var num = Math.round(data*100);return num/100}limit2( num1 );  //3.46limit2( 2.42 );    //2.42console.log(limit2(num1));console.log(limit2(2.42));console.log(limit2(-1.15555555))

写一个函数,获取从min到max之间的随机数,包括min不包括max。
代码:

function fun(min,max){return min+Math.random()*(max-min)}console.log(fun(5,10))

写一个函数,获取从min都max之间的随机整数,包括min包括max。
代码:

function fun(min,max){return Math.Round(min+Math.random()*(max-min))}console.log(fun(5,10))

写一个函数,获取一个随机数组,数组中元素为长度为len,最小值为min,最大值为max(包括)的随机数 .
代码:

function fun(min,max,leng){var arr = []for(i=0;i<leng;i++){var value = max-Math.random()*(max-min)arr.push(value)}return arr}console.log(fun(5,10,6))

相信看了本文案例你已经掌握了方法,更多精彩请关注创想鸟其它相关文章!

相关阅读:

JS的闭包与定时器

JS的Dom与事件小结

以上就是JavaScript数组-字符串-数学函数的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1545915.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
怎样用CSS3制作登录框
上一篇 2025年12月21日 17:38:29
下一篇 2025年12月21日 17:38:44

相关推荐

  • safari浏览器如何阻止广告重定向_safari浏览器广告重定向阻止方法

    首先启用Safari的“阻止弹出式窗口”功能,再安装Adblock Plus等广告拦截扩展并开启全局运行,接着清除历史记录与网站数据以删除潜在追踪脚本,最后可临时关闭JavaScript阻断重定向,但需注意可能影响网页功能。 如果您在浏览网页时发现 Safari 浏览器频繁跳转到广告页面,这可能是由…

    2026年8月29日
    100
  • # Laravel 中高效加载关联模型 ID 数组的实践指南

    本文旨在介绍如何在 Laravel 中高效地加载关联模型的 ID 数组,避免多次使用 `transform` 函数,并通过 `pluck` 方法、循环处理以及使用查询构建器等多种方式,优化数据查询性能,最终提供简洁且高效的代码示例。在 Laravel 开发中,经常会遇到需要加载关联模型,并且只需要关…

    2026年8月29日
    400
  • VSCode怎么编写地图定位_VSCode集成地图API开发位置服务应用教程

    答案是集成地图API实现定位需选择服务商、引入SDK、初始化地图并调用定位功能。具体为:在VSCode中创建Web项目,引入百度等地图API的SDK,通过HTML页面加载地图容器,使用JavaScript初始化地图实例,并结合浏览器Geolocation API或地图SDK自带控件获取位置,最后添加…

    2026年8月29日
    100
  • Mac+IDEA+百度富文本UEditor

    Mac+IDEA+百度富文本UEditorMac+IDEA+百度富文本UEditorMac+IDEA+百度富文本UEditorMac+IDEA+百度富文本UEditor

    最近,我在项目中需要嵌入一个富文本编辑器,考虑到百度ueditor的强大功能,决定使用它。然而,从%ignore_a_1%+eclipse环境转到mac+idea后,遇到了几个问题。经过一番努力,终于解决了这些问题,现分享我的经验。 环境:Mac + IDEA + UEditor 基于 Maven+…

    2026年8月29日 用户投稿
    200
  • 入门爬虫,不讲道理,只摆问题

    入门爬虫,不讲道理,只摆问题入门爬虫,不讲道理,只摆问题入门爬虫,不讲道理,只摆问题入门爬虫,不讲道理,只摆问题

    其实我也算是入门爬虫,目前也还有很多东西没有吃透,比如很多人入门选择使用的正则式我就没记清楚,对于很多反扒也并不算特别深入。但这并不影响我学习爬虫的信心和兴趣。。。没办法,必须要学啊。很多数据我不能跪着求别人给,因为别人不会给。。。被逼着学习爬虫,希望我的学习能有好结果吧 import json i…

    2026年8月28日 用户投稿
    100
  • VSCode怎么更改鼠标颜色_VSCode自定义鼠标指针颜色与样式教程

    答案:可通过修改VSCode设置自定义光标颜色、样式、粗细及闪烁方式以提升编码体验。具体包括在settings.json中配置editor.cursorStyle、editor.cursorWidth、editor.cursorBlinking,以及通过workbench.colorCustomiz…

    2026年8月28日
    100
  • 避免 jQuery AJAX POST 请求重复提交的策略与实践

    本文探讨了在使用 jQuery AJAX 进行 POST 请求时,如何有效避免因事件监听器、快速点击或意外行为导致的重复提交问题。我们将介绍一种基于状态标志的解决方案,通过控制请求的执行时机,确保数据提交的准确性和一致性,并提供相应的代码示例和最佳实践建议,以优化用户体验和系统稳定性。 问题描述:A…

    2026年8月28日
    200
  • VSCode怎么写JAVA项目_VSCode创建与开发Java项目完整教程

    答案是:配置VSCode写Java需三步——装JDK、配环境变量、装Java扩展包;创建项目用命令面板选Maven/Gradle;通过设置JDK路径、代码格式化、调内存提升效率;常见问题如语言服务器失败可清缓存或重启解决;依赖管理靠pom.xml或build.gradle,VSCode侧边栏提供Ma…

    2026年8月28日
    400
  • 推荐几款好用的文本编辑器

    推荐几款好用的文本编辑器推荐几款好用的文本编辑器推荐几款好用的文本编辑器推荐几款好用的文本编辑器

    作为程序员,编写和查看代码是日常工作的重要部分。今天,我将为大家介绍几款实用的文本编辑器。 Sublime Text 是一款轻量、简洁、高效且跨平台的编辑器。 Sublime Text的特色功能包括: 出色的扩展功能,官方称为安装包(Package)。它没有传统的右侧滚动条,而是用代码缩略图代替,这…

    2026年8月28日 用户投稿
    300
  • Laravel 中创建排名表单并实现数据排序

    本文旨在指导 Laravel 初学者构建一个简单的排名系统,允许用户对多个项目进行排序,并将排序结果存储在数据库中。我们将介绍如何设计数据库结构,以及如何使用 Eloquent ORM 实现数据的读取和排序。通过本文,你将掌握在 Laravel 应用中创建和管理排名数据的基本方法。 数据库结构设计 …

    2026年8月28日
    200
  • 重磅 | GitHub 已确认被微软收购!

    github作为一个庞大的代码库,已成为开发人员和公司托管项目、文档和代码的首选平台。苹果、亚马逊、谷歌等众多科技巨头都使用github。微软是该平台的最大贡献者,拥有超过1000名员工积极推送代码到github上的存储库中。微软甚至在github上公开托管了原始windows文件管理器的源代码。2…

    2026年8月28日
    200
  • 手把手教你们Python配置OpenCV环境,小白看一遍就会了

    手把手教你们Python配置OpenCV环境,小白看一遍就会了手把手教你们Python配置OpenCV环境,小白看一遍就会了手把手教你们Python配置OpenCV环境,小白看一遍就会了手把手教你们Python配置OpenCV环境,小白看一遍就会了

    ?️‍?1、简介?1.1、Opecv介绍 开课之前,我们先给大家讲讲opecv是一个基于bsd许可(开源)发行的跨平台计算机视觉和机器学习软件库,可以运行在linux、windows、android和mac os操作系统上。 [1] 它轻量级而且高效——由一系列 c 函数和少量 c++ 类构成,同时…

    2026年8月28日 用户投稿
    400
  • React前端与PHP后端联调:高效定位与解决PHP错误

    本文针对React前端与PHP后端集成时,PHP错误难以追踪的问题,提供了两种高效调试策略。核心在于通过配置PHP服务器端错误日志,将详细错误信息记录到文件,以及利用浏览器开发者工具的网络面板直接检查API的原始响应,从而避免JSON解析错误并快速定位后端问题。 问题剖析:React前端下PHP错误…

    2026年8月28日
    100
  • C# 进程间通讯

    一、进程间通信的方式 1)共享内存 包括:内存映射文件、共享内存DLL、剪切板。 2)命名管道和匿名管道 3)消息通信 4)利用代理方法,例如SOCKET、配置文件、注册表方式等。 方法一:通信。 进程间通信的方式多种多样,常用的有共享内存(如内存映射文件、共享内存DLL、剪切板等)、命名管道和匿名…

    2026年8月28日
    200
  • Windows + Claude Code + Cursor 安装、配置和激活!揭秘最全指南!

    Windows + Claude Code + Cursor 安装、配置和激活!揭秘最全指南!Windows + Claude Code + Cursor 安装、配置和激活!揭秘最全指南!Windows + Claude Code + Cursor 安装、配置和激活!揭秘最全指南!Windows + Claude Code + Cursor 安装、配置和激活!揭秘最全指南!

    前言 用过ai编程工具的小伙伴,肯定都知道claude。claude 系列模型在编程领域的口碑绝对是佼佼者!很多ai工具都接入claude的模型! 图片 鉴于Claude 系列模型的优秀表现,官方也推出自己的编程工具 Claude Code ,也是收费的。 图片 另外,单独的Claude模型需要一些…

    2026年8月28日 用户投稿
    100
  • 利用window自带的powershell进行文件哈希值校验

    通常为了保证我们从网上下载的文件的完整性和可靠性,我们把文件下载下来以后都会校验一下md5值或sha1值(例如验证[下载的win10 iso镜像]是否为原始文件),这一般都需要借助专门的md5检验工具来完成。但其实使用windows系统自带的windows powershell运行命令即可进行文件m…

    2026年8月28日
    300
  • VSCode怎么设置代码对齐_VSCode代码对齐与缩进规则配置教程

    答案:VSCode通过配置格式化工具和扩展实现代码对齐,需安装对应语言的工具(如Prettier、autopep8),启用formatOnSave自动格式化,或使用Shift+Alt+F手动格式化;通过.editorconfig统一团队风格,检查文件类型识别和扩展冲突解决格式化失效问题;在setti…

    2026年8月28日
    100
  • 基于Windows的渗透测试虚拟机系统

    基于Windows的渗透测试虚拟机系统基于Windows的渗透测试虚拟机系统基于Windows的渗透测试虚拟机系统基于Windows的渗透测试虚拟机系统

    今天我们将为大家详细介绍一款名为commando vm的渗透测试虚拟机。这是一款基于windows的高度可定制的渗透测试虚拟机环境,目前已发布正式版本,适用于渗透测试和红队研究。 工具安装 基础要求:建议在安装Commando VM之前,确保虚拟机已更新至最新版本,并检查更新、重启设备并确认更新已完…

    2026年8月28日 用户投稿
    200
  • PHP:高效检查多维数组中是否存在重复的嵌套项

    本文将探讨如何在 php 中有效检查一个多维数组是否已包含具有相同嵌套项的元素。针对 `in_array()` 函数在处理复杂数组时的局限性,我们将介绍通过迭代和直接比较嵌套子数组的方法,确保在添加新数据前避免重复,从而维护数据结构的唯一性和完整性。 在 PHP 开发中,我们经常需要处理包含复杂数据…

    2026年8月28日
    200
  • 聊聊flink的Tumbling Window

    序 本文主要研究一下flink的tumbling window WindowAssigner flink-streaming-java_2.11-1.7.0-sources.jar!/org/apache/flink/streaming/api/windowing/assigners/WindowA…

    2026年8月27日
    100

发表回复

登录后才能评论
关注微信