前端学习之JavaScript
对象
key:value{ }。无序的值列表
当属性名称包含空格时,需要将其用引号括起来。例如,以下address对象具有'building no'一个属性:
let address = {'building no': 3960,street: 'North 1st street',state: 'CA',country: 'USA'
};
要访问该'building no'属性,需要使用类似数组的表示法:
address['building no'];代码语言: CSS (css )
如果使用点号表示法,将会出错:
address.'building no';
向对象添加新属性
person.age = 25;
删除对象的属性
要删除对象的属性,可以使用delete以下运算符:
delete objectName.propertyName;
delete person.age;
检查属性是否存在
使用in运算符:
propertyName in objectName
小结
-
对象是键值对的集合。
-
使用点号表示法(
.)或数组表示法([])来访问对象的属性。 -
使用
delete运算符可以从对象中删除属性。 -
使用
in运算符检查对象中是否存在某个属性。
原始值和引用值
-
Javascript 有两种类型的值:原始值和引用值。
-
你可以对引用值添加、更改或删除属性,但不能对原始值执行此操作。
-
将一个变量中的原始值复制到另一个变量会创建一个单独的值副本,这意味着更改一个变量中的值不会影响另一个变量。
-
将一个变量的引用复制到另一个变量,会创建一个新的引用,使得两个变量指向同一个对象。这意味着通过一个变量对对象进行更改,会反映到另一个变量中。
原始值primitive存在stack里;引用值reference存在heap里,用指针指向
与引用值不同,原始值不能拥有属性。
如果尝试向原始值添加属性,则不会生效
let name = 'John'; name.alias = 'Knight'; console.log(name.alias); // undefined 代码语言: JavaScript (javascript )
输出:
undefined
复制值
当你将一个变量中的原始值赋给另一个变量时,JavaScript 引擎会创建该值的副本并将其赋值给目标变量。例如:
let age = 25; let newAge = age;
在栈内存中,a``newAge和b``age是独立的变量。更改其中一个变量的值不会影响另一个变量。
当你将一个变量的引用值赋给另一个变量时,JavaScript 引擎会创建一个引用,使这两个变量指向堆内存中的同一个对象。这意味着如果你更改其中一个变量,它会影响另一个变量。因为他们是用指针指向堆,不是用内存直接保存
Array数组
-
数组可以存储混合类型的值。例如,你可以创建一个数组,其中存储的元素类型包括数字、字符串、布尔值和null。
-
数组的大小是动态的,并且会自动增长。换句话说,你不需要预先指定数组的大小。
创建数组
Array构造函数
let scores = new Array();
JavaScript 允许new在使用Array()构造函数时省略运算符。例如,以下语句创建 artists数组。
let artists = Array();
创建数组的更推荐方法是使用数组字面量表示法:
let arrayName = [element1, element2, element3, ...];
数组字面量形式使用方括号[]将以逗号分隔的元素列表括起来。
要创建一个空数组,可以使用方括号,而不指定任何元素,如下所示:
let emptyArray = [];
访问数组
JavaScript 数组的索引从零开始
arrayName[index]
数组基本操作
-
push()数组末尾添加元素
et seas = ['Black Sea', 'Caribbean Sea', 'North Sea', 'Baltic Sea']; seas.push('Red Sea'); console.log(seas); -
向数组开头添加元素unshift()
let seas = ['Black Sea', 'Caribbean Sea', 'North Sea', 'Baltic Sea']; seas.unshift('Red Sea'); console.log(seas); -
从数组末尾删除元素pop()
-
从数组开头移除一个元素shift()
-
查找数组中的元素索引indexOf()
let seas = ['Black Sea', 'Caribbean Sea', 'North Sea', 'Baltic Sea']; let index = seas.indexOf('North Sea'); console.log(index); // 2 -
检查值是否为数组Array.isArray()
console.log(Array.isArray(seas)); // true
setTimeout
-
setTimeout()是 window 对象的一个方法。
该方法setTimeout() 设置一个定时器,并在定时器到期后执行[回调函数。
let timeoutID = setTimeout(执行代码, 时间间隔);
setInterval()
函数function
-
在 JavaScript 中,函数是一等公民。
-
您可以将函数作为参数传递给其他函数,也可以将它们作为值从其他函数返回,还可以将它们存储在变量中。
匿名函数
没有名称的函数
() => { ... }
匿名函数在创建后无法访问。因此,通常需要将其赋值给一个变量。
如果你想创建一个函数并在声明后立即执行它,你可以像这样声明一个匿名函数:
(function() {console.log('IIFE');
})();
let myFunction = () => { ... } 👉 箭头函数本身是匿名的, 👉 但通过赋值给变量,它变成了一个具名的函数引用。
按值传递
函数内部对参数所做的任何更改都不会反映到函数外部传递的变量上。换句话说,对参数所做的更改不会反映到函数外部。
通过创建原始值的副本,来实现
-
JavaScript 会按值将所有参数传递给函数。
-
在 JavaScript 中,函数参数是局部变量。
递归函数
递归函数是指不断调用自身直到调用次数停止的[函数]
function recurse() {if(condition) {// stop calling itself//...} else {recurse();}
}
递归函数用于将大问题分解成小问题。递归函数常见于二叉树、图等数据结构以及二分查找、快速排序等算法中。
-
递归函数总会有一个条件阻止函数调用自身。
终止:
-
递归不断发生,将问题分解成更小的子问题,直到达到基本情况。
-
一旦达到基本情况,该函数就开始回溯,将每一层递归的结果结合起来,直到得到最终结果。
参数
参数的默认值为undefined。这意味着,如果您不向函数传递参数,则其参数将具有默认值undefined。
在 JavaScript (ES6) 中设置默认参数的正确方法是:
JavaScript
function greet(name = 'Guest') {console.log('Hello ' + name);
}
该语法 ( parameter = defaultValue) 允许您在函数定义中,为参数指定一个默认值。
-
如果调用函数时提供了该参数,函数将使用您提供的值。
-
greet('Alice');// 输出:“你好爱丽丝”
-
-
如果调用函数时未提供该参数(或确定
undefined),函数将使用默认值Guest。-
greet();// 输出:“您好,客人”
-
Promise
要从函数返回的用户列表中按用户名查找用户getUsers(),可以使用findUser()如下函数:
function findUser(username) {const users = getUsers();const user = users.find((user) => user.username === username);return user;
}代码语言: JavaScript (javascript )
在findUser()函数中:
-
首先,调用
getUsers()函数获取用户数组。 -
username其次,利用对象find()的方法查找具有特定属性的用户Array。 -
第三,返回匹配的用户。
小结:1,JavaScript思维导图画出来了,用幕布做思维导图很方便,适合我这种视觉学习者。(脑子里想象不出画面)
2,对数据类型,对象,数组理解加深;函数一等公民这些也理解一些
3,明天看object对象,感觉JavaScript很快要看玩了,开心
