学习JavaScript第三天
1.数组
在JavaScript中,数组是一种非常灵活的数据结构,用于存储多个值。数组可以包含任何类型的数据,包括数字、字符串、对象甚至其他数组(也就是多维数组)。JavaScript中的数组是动态的,这意味着它们的大小可以随时改变。
1.1创建数组
- 数组字面量
let arr = [1,2,3,4,5]
- Array构造函数:
let fruits = new Array("Apple", "Banana", "Cherry");
- Array.of():
let fruits = Array.of("Apple", "Banana", "Cherry");
- Array.from():
let arrayLike = {0: "Apple", 1: "Banana", 2: "Cherry", length: 3}
1.2数组方法
JavaScript数组提供了许多内置方法,用于操作数组。以下是一些常用的数组方法:
- push() 和 pop():
push():在数组末尾添加一个或多个元素,并返回新数组的长度。pop():移除数组的最后一个元素,并返回被移除的元素。
let fruits = ["Apple", "Banana"];
fruits.push("Cherry");
console.log(fruits); // 输出 ["Apple", "Banana", "Cherry"]
let removed = fruits.pop();
console.log(fruits); // 输出 ["Apple", "Banana"]
console.log(removed); // 输出 "Cherry"
- unshift() 和 shift():
- unshift():在数组的开头添加一个或多个元素,并返回新数组的长度。
- shift():移除数组的第一个元素,并返回被移除的元素。
let fruits = ["Banana", "Cherry"];
fruits.unshift("Apple");
console.log(fruits); // 输出 ["Apple", "Banana", "Cherry"]
let removed = fruits.shift();
console.log(fruits); // 输出 ["Banana", "Cherry"]
console.log(removed); // 输出 "Apple"
1.3数组遍历
你可以使用多种方式遍历数组:
- for循环:
let fruits = ["Apple", "Banana", "Cherry"];
for (let i = 0; i < fruits.length; i++) {
console.log(fruits[i]);
}
- forEach()
let fruits = ["Apple", "Banana", "Cherry"];
fruits.forEach(fruit => {
console.log(fruit);
});
- for … of循环:
let fruits = ["Apple", "Banana", "Cherry"];
for (let fruit of fruits) {
console.log(fruit);
}
2.函数
JavaScript中的函数是一段可以被重复调用的代码块。函数允许你组织代码,使其更加模块化和可重用。以下是JavaScript函数的一些基本概念和用法。
2.1函数的定义
function functionName(parameters) {
// 代码
}
2.2函数的参数以及返回值
function calculateSquare(number) {
return number * number;
}
console.log(calculateSquare(5)); // 输出 25
2.3函数的作用域
函数有自己的作用域,这意味着在函数内部声明的变量在函数外部是不可见的。
2.4函数传参
function doSomethingWith(value, callback) {
return callback(value);
}
function square(x) {
return x * x;
}
console.log(doSomethingWith(4, square)); // 输出 16
3.对象
什么是对象?
- 在 JavaScript 中,对象是一组无序的相关属性和方法的集合,所有的事物都是对象,例如字符串、数值、数组、函数等。 对象是由属性和方法组成的。
- 属性:事物的特征,在对象中用属性来表示(常用名词)
- 方法:事物的行为,在对象中用方法来表示(常用动词)
创建对象的三种方式:
- 使用对象字面量创建对象:
var star = {
name : 'pink',
age : 18,
sex : '男',
sayHi : function(){
alert('大家好啊~');
}
};
- 利用 new Object 创建对象:
var andy = new Obect();
andy.name = 'pink';
andy.age = 18;
andy.sex = '男';
andy.sayHi = function(){
alert('大家好啊~');
- 利用构造函数创建对象
构造函数
构造函数:是一种特殊的函数,主要用来初始化对象,即为对象成员变量赋初始值,它总与 new
运算符一起使用。我们可以把对象中一些公共的属性和方法抽取出来,然后封装到这个函数里面。
构造函数的封装格式:
function 构造函数名(形参1,形参2,形参3) {
this.属性名1 = 参数1;
this.属性名2 = 参数2;
this.属性名3 = 参数3;
this.方法名 = 函数体;
}
学习JavaScript第三天的更多相关文章
- 学习javascript数据结构(三)——集合
前言 总括: 本文讲解了数据结构中的[集合]概念,并使用javascript实现了集合. 原文博客地址:学习javascript数据结构(三)--集合 知乎专栏&&简书专题:前端进击者 ...
- 学习 JavaScript (三)核心概念:语法、变量、数据类型
JavaScript 的核心概念主要由语法.变量.数据类型.操作符.语句.函数组成,这篇文章主要讲解的是前面三个,后面三个下一篇文章再讲解. 01 语法 熟悉 JavaScript 历史的人应该都知道 ...
- 学习JavaScript第三周
字符串的遍历,字符串虽是简单数据类型却有对应的属性和方法,这是因为字符串是包装类型(当然布尔类型和数字类型也是包装类型),临时具有对象的属性和方法,在使用完后就会释放对象. 简单的淡入淡出的轮播图,原 ...
- 学习javascript数据结构(二)——链表
前言 人生总是直向前行走,从不留下什么. 原文地址:学习javascript数据结构(二)--链表 博主博客地址:Damonare的个人博客 正文 链表简介 上一篇博客-学习javascript数据结 ...
- 学习javascript数据结构(四)——树
前言 总括: 本文讲解了数据结构中的[树]的概念,尽可能通俗易懂的解释树这种数据结构的概念,使用javascript实现了树,如有纰漏,欢迎批评指正. 原文博客地址:学习javascript数据结构( ...
- (转)轻松学习JavaScript三:JavaScript与HTML的结合
摘自:http://blog.csdn.net/erlian1992 HTML中的JavaScript脚本必须位于<script>与</script>标签之间,JavaScri ...
- 前端资讯周报 3.6 - 3.12: 对学习Javascript最有帮助的三本书,以及HTML标题的迷思
每周一我都会分享上一周我订阅的技术站点中,和解决问题的过程中阅读到的值得分享的文章. 毕竟个人的阅读量有限,也欢迎大家留言或者私信给我你们阅读到的,对你们前端技术有帮助的任何内容,题材不限,语言不限. ...
- ife task0003学习笔记(三):JavaScript闭包
一.this易错分析 在学习闭包的时候,有一个概念this很重要,关于this的理解,下面3种情况:this指向谁? fn.call(obj1); obj2.fn() fn() 答案是obj1 obj ...
- 重读《学习JavaScript数据结构与算法-第三版》-第2章 ECMAScript与TypeScript概述
定场诗 八月中秋白露,路上行人凄凉: 小桥流水桂花香,日夜千思万想. 心中不得宁静,清早览罢文章, 十年寒苦在书房,方显才高志广. 前言 洛伊安妮·格罗纳女士所著的<学习JavaScript数据 ...
- 重读《学习JavaScript数据结构与算法-第三版》- 第3章 数组(一)
定场诗 大将生来胆气豪,腰横秋水雁翎刀. 风吹鼍鼓山河动,电闪旌旗日月高. 天上麒麟原有种,穴中蝼蚁岂能逃. 太平待诏归来日,朕与先生解战袍. 此处应该有掌声... 前言 读<学习JavaScr ...
随机推荐
- vscode中文环境配置
1.背景 2.配置 2.1.安装中文包 如果没有按照中文插件需要先按照中文插件 如果你是首次安装,安装完成后会引导你重启,就可以了 2.2.设置成中文环境 打开VSCode软件,按快捷键[Ctrl+S ...
- css 样式 element.style 覆盖问题
问题: 我们在写网页定制样式的时候发现展示效果跟我们预想的不一样? 打开F12一看原来是element.style 覆盖的我定义的效果. 解决: 只要在定义的内容后面加上 !important 就行啦 ...
- 一些八股:1.fetch 的理解。2.let、const、var
一. 说说你对 Fetch 的理解,它有哪些优点和不足? Fetch API 是现代 JavaScript 中用于进行网络请求的接口,旨在替代传统的 XMLHttpRequest.它提供了一种更简单. ...
- 深度解读昇腾CANN小shape算子计算优化技术,进一步减少调度开销
摘要:Host调度模式下,GE将模型中算子的执行单元划分为Host CPU执行与Device(昇腾AI处理器)执行两大类. 本文分享自华为云社区<深度解读昇腾CANN小shape算子计算优化技术 ...
- JavaScript设计模式样例十三 —— 模版方法模式
模板方法模式(Template Method Pattern) 定义:一个抽象类公开定义了执行它的方法的方式/模板.它的子类可以按需要重写方法实现,但调用将以抽象类中定义的方式进行.目的:一些方法通用 ...
- Adobe Photoshop cc2022 Mac中文破解版下载安装
PS2024 for Mac,我这个版本是Mac版25.2,大小4.03G,支持intel/M1/M2/M3芯片,最低系统需求:13.4以上,不限速下载地址还是放在最后. 然后安装总共有三个步骤,尤其 ...
- sentinel 的限流规则及流量控制
sentinel 前方参考 计算QPS-Sentinel限流算法 https://www.cnblogs.com/yizhiamumu/p/16819497.html Sentinel 介绍与下载使用 ...
- 使用Vue3.5的onWatcherCleanup封装自动cancel的fetch函数
前言 在欧阳的上一篇 这应该是全网最详细的Vue3.5版本解读文章中有不少同学对Vue3.5新增的onWatcherCleanup有点疑惑,这个新增的API好像和watch API回调的第三个参数on ...
- 项目完成小结:使用DjangoStarter v3和Taro开发的微信小程序
前言 不知不觉已经九月了,又到了一年的开学季,我每年都想做的项目墙甚至连个影子都没有- 最近生活中的琐事太多了,导致完全没有想写文章的动力,不过再怎么拖还是得记录,随便写写吧~ 这次是7月份的一个小项 ...
- 使用 Performance API 实现前端资源监控
1. Performance API 的用处 Performance API 是浏览器中内置的一组工具,用于测量和记录页面加载和执行过程中的各类性能指标.它的主要用处包括: 监控页面资源加载:跟踪页面 ...