JavaScript - First step - Arrays

2024-09-03 00:08
文章标签 java script step first arrays

本文主要是介绍JavaScript - First step - Arrays,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

创建数组

任何类型的对象,都可以放入数组中。

var shopping = ['bread', 'milk', 'cheese', 'hummus', 'noodles'];
shopping;
// (5) ["bread", "milk", "cheese", "hummus", "noodles"]var sequence = [1, 1, 2, 3, 5, 8, 13];
var random = ['tree', 795, [0, 1, 2]];

存取、变更,数组元素

shopping[0];
// returns "bread"shopping[0] = 'tahini';
shopping;
// shopping will now return [ "tahini", "milk", "cheese", "hummus", "noodles" ]

获取数组长度

sequence.length;
// should return 7var sequence = [1, 1, 2, 3, 5, 8, 13];
for (var i = 0; i < sequence.length; i++) {console.log(sequence[i]);
}

部分数组方法

字符串和数组之间的转换

var myData = 'Manchester,London,Liverpool,Birmingham,Leeds,Carlisle';var myArray = myData.split(',');
myArray;myArray.length;
myArray[0]; // the first item in the array
myArray[1]; // the second item in the array
myArray[myArray.length-1]; // the last item in the arrayvar myNewString = myArray.join(',');
myNewString;var dogNames = ['Rocket','Flash','Bella','Slugger'];
dogNames.toString(); //Rocket,Flash,Bella,Slugger

添加、移除,数组元素

var myArray = ['Manchester', 'London', 'Liverpool', 'Birmingham', 'Leeds', 'Carlisle'];// 向数组末尾添加元素
myArray.push('Cardiff');
myArray;
myArray.push('Bradford', 'Brighton');
myArray;var newLength = myArray.push('Bristol');
myArray;
newLength;// 移除数组末尾的元素
myArray.pop();var removedItem = myArray.pop();
myArray;
removedItem;// 向数组起首添加元素
myArray.unshift('Edinburgh');
myArray;// 移除数组起首元素
var removedItem = myArray.shift();
myArray;
removedItem;
let customName = document.getElementById('customname');
let randomize = document.querySelector('.randomize');
let story = document.querySelector('.story');function randomValueFromArray(array) {return array[Math.floor(Math.random() * array.length)];
}let storyText = "It was 94 fahrenheit outside, so :insertx: went for a walk. When they got to :inserty:, they stared in horror for a few moments, then :insertz:. Bob saw the whole thing, but was not surprised — :insertx: weighs 300 pounds, and it was a hot day.";
let insertX = ["Willy the Goblin", "Big Daddy", "Father Christmas"];
let insertY = ["the soup kitchen", "Disneyland", "the White House"];
let insertZ = ["spontaneously combusted", "melted into a puddle on the sidewalk", "turned into a slug and crawled away"];randomize.addEventListener("click", result);function result() {let newStory = storyText;let xItem = randomValueFromArray(insertX);let yItem = randomValueFromArray(insertY);let zItem = randomValueFromArray(insertZ);newStory = newStory.replace(":insertx:", xItem);newStory = newStory.replace(":inserty:", yItem);newStory = newStory.replace(":insertz:", zItem);if (customName.value !== '') {let name = customName.value;newStory = newStory.replace("Bob", name);}if (document.getElementById("uk").checked) {let weight = Math.round(300 * 0.0714286) + " stone";let temperature = Math.round((94 - 32) * 5 / 9) + " centigrade";newStory = newStory.replace("300 pounds", weight);newStory = newStory.replace("94 fahrenheit", temperature);}story.textContent = newStory;story.style.visibility = 'visible';
}

 

这篇关于JavaScript - First step - Arrays的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1131461

相关文章

Java使用Curator进行ZooKeeper操作的详细教程

《Java使用Curator进行ZooKeeper操作的详细教程》ApacheCurator是一个基于ZooKeeper的Java客户端库,它极大地简化了使用ZooKeeper的开发工作,在分布式系统... 目录1、简述2、核心功能2.1 CuratorFramework2.2 Recipes3、示例实践3

Springboot处理跨域的实现方式(附Demo)

《Springboot处理跨域的实现方式(附Demo)》:本文主要介绍Springboot处理跨域的实现方式(附Demo),具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不... 目录Springboot处理跨域的方式1. 基本知识2. @CrossOrigin3. 全局跨域设置4.

springboot security使用jwt认证方式

《springbootsecurity使用jwt认证方式》:本文主要介绍springbootsecurity使用jwt认证方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地... 目录前言代码示例依赖定义mapper定义用户信息的实体beansecurity相关的类提供登录接口测试提供一

Spring Boot 3.4.3 基于 Spring WebFlux 实现 SSE 功能(代码示例)

《SpringBoot3.4.3基于SpringWebFlux实现SSE功能(代码示例)》SpringBoot3.4.3结合SpringWebFlux实现SSE功能,为实时数据推送提供... 目录1. SSE 简介1.1 什么是 SSE?1.2 SSE 的优点1.3 适用场景2. Spring WebFlu

基于SpringBoot实现文件秒传功能

《基于SpringBoot实现文件秒传功能》在开发Web应用时,文件上传是一个常见需求,然而,当用户需要上传大文件或相同文件多次时,会造成带宽浪费和服务器存储冗余,此时可以使用文件秒传技术通过识别重复... 目录前言文件秒传原理代码实现1. 创建项目基础结构2. 创建上传存储代码3. 创建Result类4.

Java利用JSONPath操作JSON数据的技术指南

《Java利用JSONPath操作JSON数据的技术指南》JSONPath是一种强大的工具,用于查询和操作JSON数据,类似于SQL的语法,它为处理复杂的JSON数据结构提供了简单且高效... 目录1、简述2、什么是 jsONPath?3、Java 示例3.1 基本查询3.2 过滤查询3.3 递归搜索3.4

Tomcat版本与Java版本的关系及说明

《Tomcat版本与Java版本的关系及说明》:本文主要介绍Tomcat版本与Java版本的关系及说明,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录Tomcat版本与Java版本的关系Tomcat历史版本对应的Java版本Tomcat支持哪些版本的pythonJ

springboot security验证码的登录实例

《springbootsecurity验证码的登录实例》:本文主要介绍springbootsecurity验证码的登录实例,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,... 目录前言代码示例引入依赖定义验证码生成器定义获取验证码及认证接口测试获取验证码登录总结前言在spring

SpringBoot日志配置SLF4J和Logback的方法实现

《SpringBoot日志配置SLF4J和Logback的方法实现》日志记录是不可或缺的一部分,本文主要介绍了SpringBoot日志配置SLF4J和Logback的方法实现,文中通过示例代码介绍的非... 目录一、前言二、案例一:初识日志三、案例二:使用Lombok输出日志四、案例三:配置Logback一

springboot security快速使用示例详解

《springbootsecurity快速使用示例详解》:本文主要介绍springbootsecurity快速使用示例,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝... 目录创www.chinasem.cn建spring boot项目生成脚手架配置依赖接口示例代码项目结构启用s