js 知识点整理
1.
indexOf
与String类似,Array
也可以通过indexOf()
来搜索一个指定的元素的位置:
var arr = [10, 20, '30', 'xyz'];
arr.indexOf(10); // 元素10的索引为0
arr.indexOf(20); // 元素20的索引为1
arr.indexOf(30); // 元素30没有找到,返回-1
arr.indexOf('30'); // 元素'30'的索引为2
注意了,数字30
和字符串'30'
是不同的元素。
2.
slice
slice()
就是对应String的substring()
版本,它截取Array
的部分元素,然后返回一个新的Array
:
var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];
arr.slice(, ); // 从索引0开始,到索引3结束,但不包括索引3: ['A', 'B', 'C']
arr.slice(); // 从索引3开始到结束: ['D', 'E', 'F', 'G']
注意到slice()
的起止参数包括开始索引,不包括结束索引。
如果不给slice()
传递任何参数,它就会从头到尾截取所有元素。利用这一点,我们可以很容易地复制一个Array
:
var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];
var aCopy = arr.slice();
aCopy; // ['A', 'B', 'C', 'D', 'E', 'F', 'G']
aCopy === arr; // false
3.
push和pop
push()
向Array
的末尾添加若干元素,pop()
则把Array
的最后一个元素删除掉:
var arr = [1, 2];
arr.push('A', 'B'); // 返回Array新的长度: 4
arr; // [1, 2, 'A', 'B']
arr.pop(); // pop()返回'B'
arr; // [1, 2, 'A']
arr.pop(); arr.pop(); arr.pop(); // 连续pop 3次
arr; // []
arr.pop(); // 空数组继续pop不会报错,而是返回undefined
arr; // []
4.
unshift和shift
如果要往Array
的头部添加若干元素,使用unshift()
方法,shift()
方法则把Array
的第一个元素删掉:
var arr = [1, 2];
arr.unshift('A', 'B'); // 返回Array新的长度: 4
arr; // ['A', 'B', 1, 2]
arr.shift(); // 'A'
arr; // ['B', 1, 2]
arr.shift(); arr.shift(); arr.shift(); // 连续shift 3次
arr; // []
arr.shift(); // 空数组继续shift不会报错,而是返回undefined
arr; // []
5.
Map
Map
是一组键值对的结构,具有极快的查找速度。
举个例子,假设要根据同学的名字查找对应的成绩,如果用Array
实现,需要两个Array
:
var names = ['Michael', 'Bob', 'Tracy'];
var scores = [95, 75, 85];
给定一个名字,要查找对应的成绩,就先要在names中找到对应的位置,再从scores取出对应的成绩,Array越长,耗时越长。
如果用Map实现,只需要一个“名字”-“成绩”的对照表,直接根据名字查找成绩,无论这个表有多大,查找速度都不会变慢。用JavaScript写一个Map如下:
var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]);
m.get('Michael'); // 95
初始化Map
需要一个二维数组,或者直接初始化一个空Map
。Map
具有以下方法:
var m = new Map(); // 空Map
m.set('Adam', 67); // 添加新的key-value
m.set('Bob', 59);
m.has('Adam'); // 是否存在key 'Adam': true
m.get('Adam'); // 67
m.delete('Adam'); // 删除key 'Adam'
m.get('Adam'); // undefined
由于一个key只能对应一个value,所以,多次对一个key放入value,后面的值会把前面的值冲掉:
var m = new Map();
m.set('Adam', 67);
m.set('Adam', 88);
m.get('Adam'); // 88
6.
Set
Set
和Map
类似,也是一组key的集合,但不存储value。由于key不能重复,所以,在Set
中,没有重复的key。
要创建一个Set
,需要提供一个Array
作为输入,或者直接创建一个空Set
:
var s1 = new Set(); // 空Set
var s2 = new Set([, , ]); // 含1, 2, 3
重复元素在Set
中自动被过滤:
var s = new Set([, , , , '']);
s; // Set {1, 2, 3, "3"}
注意数字3
和字符串'3'
是不同的元素。
通过add(key)
方法可以添加元素到Set
中,可以重复添加,但不会有效果:
s.add();
s; // Set {1, 2, 3, 4}
s.add();
s; // 仍然是 Set {1, 2, 3, 4}
通过delete(key)
方法可以删除元素:
var s = new Set([, , ]);
s; // Set {1, 2, 3}
s.delete();
s; // Set {1, 2}
7.
iterable
ES6标准引入了新的iterable
类型,Array
、Map
和Set
都属于iterable
类型。
具有iterable
类型的集合可以通过新的for ... of
循环来遍历。
用for ... of
循环遍历集合,用法如下:
var a = ['A', 'B', 'C'];
var s = new Set(['A', 'B', 'C']);
var m = new Map([[, 'x'], [, 'y'], [, 'z']]);
for (var x of a) { // 遍历Array
console.log(x);
}
for (var x of s) { // 遍历Set
console.log(x);
}
for (var x of m) { // 遍历Map
console.log(x[] + '=' + x[]);
}
for ... in
循环将把name
包括在内,但Array
的length
属性却不包括在内。
for ... of
循环则完全修复了这些问题,它只循环集合本身的元素:
这就是为什么要引入新的for ... of
循环。
然而,更好的方式是直接使用iterable
内置的forEach
方法,它接收一个函数,每次迭代就自动回调该函数。
注意,forEach()
方法是ES5.1标准引入的,你需要测试浏览器是否支持。
Set
与Array
类似,但Set
没有索引,因此回调函数的前两个参数都是元素本身:
var s = new Set(['A', 'B', 'C']);
s.forEach(function (element, sameElement, set) {
console.log(element);
});
Map
的回调函数参数依次为value
、key
和map
本身:
var m = new Map([[, 'x'], [, 'y'], [, 'z']]);
m.forEach(function (value, key, map) {
console.log(value);
});
如果对某些参数不感兴趣,由于JavaScript的函数调用不要求参数必须一致,因此可以忽略它们。例如,只需要获得Array
的element
:
var a = ['A', 'B', 'C'];
a.forEach(function (element) {
console.log(element);
});
7.
arguments
JavaScript还有一个免费赠送的关键字arguments
,它只在函数内部起作用,并且永远指向当前函数的调用者传入的所有参数。arguments
类似Array
但它不是一个Array
:
function foo(x) {
console.log('x = ' + x); //
for (var i=; i<arguments.length; i++) {
console.log('arg ' + i + ' = ' + arguments[i]); // 10, 20, 30
}
}
foo(, , );
x =
arg =
arg =
arg =
8.
要编写一个产生斐波那契数列的函数,可以这么写:
function fib(max) {
var
a = ,
b = ,
arr = [, ];
while (arr.length < max) {
[a, b] = [b, a + b];
arr.push(b);
}
return arr;
} // 测试:
fib(); // [0, 1, 1, 2, 3]
fib(); // [0, 1, 1, 2, 3, 5, 8, 13, 21, 34]
js 知识点整理的更多相关文章
- JS知识点整理(二)
前言 这是对平时的一些读书笔记和理解进行整理的第二部分,第一部分请前往:JS知识点整理(一).本文包含一些易混淆.遗漏的知识点,也会配上一些例子,也许不是很完整,也许还会有点杂,但也许会有你需要的,后 ...
- JS知识点整理(一)
前言 本文把平时的一些读书笔记和理解进行了整理归纳,包含一些易混淆.遗漏的知识点,也会配上一些例子,可能不是很完整,还会有点杂,但也许会有你需要的(目前先整理了一部分,笔记有点多,后续会持续更新). ...
- fabric.js 知识点整理
fabric.js是一个很好用的 canvas 操作插件,下面整理了一些平时项目中用到的知识点: //1: 获得画布上的所有对象: var items = canvas.getObjects(); / ...
- 部分易错JS知识点整理(缓慢填坑)
主要还是各地搜刮来的,本人对于这方面的总结还是8彳亍,给各位大佬磕头了砰砰砰 1. 2.JS闭包和匿名对象以及作用域 js在执行之前,会将所有带var和function的进行提前定义和声明.(带var ...
- 【学习笔记】JS知识点整理
1 原型/原型链 1-1 原型 定义:原型是function对象的一个属性,定义了构造函数制造出的对象的公共祖先.通过该构造函数产生的对象,可以继承该原型的属性和方法. 原型是一个对象. 可以利用原型 ...
- 容易遗忘的JS知识点整理
1.hasOwnProperty相关 为了判断一个对象是否包含自定义属性而不是原型链上的属性,我们需要使用继承自 Object.prototype 的 hasOwnProperty方法.hasOwnP ...
- (转)容易遗忘的JS知识点整理
1.hasOwnProperty相关 为了判断一个对象是否包含自定义属性而不是原型链上的属性,我们需要使用继承自 Object.prototype 的 hasOwnProperty方法.hasOwnP ...
- 容易遗忘的JS知识点整理—hasOwnProperty相关
为了判断一个对象是否包含自定义属性而不是原型链上的属性,我们需要使用继承自 Object.prototype 的 hasOwnProperty方法.hasOwnProperty 是 JavaScrip ...
- vue前端面试题知识点整理
vue前端面试题知识点整理 1. 说一下Vue的双向绑定数据的原理 vue 实现数据双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty() 来劫 ...
随机推荐
- C#下使用XmlDocument详解
XML在开发中作为文件存储格式.数据交换的协议用的非常普遍,各个编程语言有都支持.W3C也制定了XML DOM的标准.在这里主要介绍下.Net中的XmlDocument,包括xml读取和写入等功能.一 ...
- centos7上安装 mysql
centos7上的安装是和其他的版本不一样的 ,因为centos上的安装与centos的操作是不通了的 在CentOS中默认安装有MariaDB,这个是MySQL的分支,但为了需要,还是要在系统中安装 ...
- spider-抓取网页内容(Beautiful soup)
http://jingyan.baidu.com/article/afd8f4de6197c834e386e96b.html http://cuiqingcai.com/1319.html Windo ...
- linux下jira搭建&破解(转自:https://www.cnblogs.com/zpw-1/p/9553358.html)
写在前面 网络类似文章不少,但是同样的路,别人走可能一马平川,自己走可能磕磕绊绊.记录一下自己搭建过程的一路踩坑历程[目前还记得的]. 一.环境准备 1,jira7.3的运行是依赖java环境的,也就 ...
- Windows Server 2008搭建域控制器
前言 1.为什么要建域 工作组的分散管理模式不适合大型的网络环境下工作,域模式就是针对大型的网络管理需求设计的,就是共享用户账号,计算机账号和安全策略的计算机集合.域中集中存储用户账号的计算机就是域控 ...
- October 2nd 2017 Week 40th Monday
Grown-ups work for things. Grown-ups pay. Grown-ups suffer consequences. 真正的成年人会奋斗.会付出.会承担后果. How to ...
- Alpha 冲刺报告(5/10)
Alpha 冲刺报告(5/10) 队名:洛基小队 峻雄(组长) 已完成:修改角色的移动脚本 明日计划:完善此项脚本 剩余任务:角色的属性脚本 困难:没有时间,代码的编写时间太慢 ----------- ...
- iOS: 聊聊 Designated Initializer(指定初始化函数):NS_DESIGNATED_INITIALIZER
总结:指定函数的调用规则: 初始化函数的调用顺序与初始化顺序相反. 上面关于指定初始化的规则讲了那么多,其实可以归纳为两点: 便利初始化函数只能调用自己类中的其他初始化方法 指定初始化函数才有资格调用 ...
- BZOJ4571:[SCOI2016]美味(主席树,贪心)
Description 一家餐厅有 n 道菜,编号 1...n ,大家对第 i 道菜的评价值为 ai(1≤i≤n).有 m 位顾客,第 i 位顾客的期望值为 bi,而他的偏好值为 xi . 因此,第 ...
- 1415. [NOI2005]聪聪和可可【记忆化搜索DP】
Description Input 数据的第1行为两个整数N和E,以空格分隔,分别表示森林中的景点数和连接相邻景点的路的条数. 第2行包含两个整数C和M,以空格分隔,分别表示初始时聪聪和可可所在的景点 ...