JavaScript和ES6个人不熟悉的知识点总结

其实个人对JS和ES6都不是很会，不会的太多了，但这篇文章主要是总结一下老师教过的以及常用的JS和ES6中的字符串和数组的方法。

JS中的字符串和数组常用方法

字符串方法

以下的方法中的str都为 let str = 'Hello World';

  1. 获取字符串长度
    字符串.length 
// 字符串长度为11 包括空格
console.log(str.length);
  1. 根据下标截取
    slice(start, end) 
//开始索引值和结束索引值
//结束位置不包含在截取之中 end省略则截取全部
//结束位小于开始位 返回空
//结果orl
console.log(str.slice(7,10));
//从负数开始 -1为倒数第一个数其他以此类推
//下面的等同于slice(7,10)
console.log(str.slice(-4,10));

//结果为Wo
console.log(str.substring(6,8));

//不同点1.是负数直接转换为0
//console.log(str.substring(0,8));
//与下面的输出一样
console.log(str.substring(-10,8));

//不同点2. 结束位置小于开始位置先交换位置再执行
//结果为 rl
console.log(str.substring(10,8));
//等同于console.log(str.substring(8,10));
  1. 根据要截取的长度截取
    substr(start,length) 
//start 开始的索引值 从0开始 必写
//为负数的话 -1等于倒数第一个数以此类推
//大于字符串长度 返回空

//length 要截取的长度
//可以省略  省略后截取从开始到结束的所有字符串
//结果 llo Wo
console.log(str.substr(2,6));
  1. 字符串分隔
    string.split(separator,limit) 
//separator 可选。字符串或正则表达式
//从该参数指定的地方分割
//limit 分隔次数 可选
//返回一个数组 不改变原来的字符串

//1.省略分隔参数
// 结果为数组 ["Hello World"]
console.log(str.split());

//2.分隔符为''分隔每个字符
//结果为 (11) ["H", "e", "l", "l", "o", " ", "W", "o", "r", "l", "d"]
 console.log(str.split(''));

//3.使用limit参数
//结果 (4) ["H", "e", "l", "l"]
console.log(str.split('',4));

//4.使用字符作为分隔符
//结果 (4) ["He", "", "o Wor", "d"]
console.log(str.split('l'));
  1. 字符串查找
    string.indexOf(searchvalue,start) 
//searchvalue 被查找的值 必写
// start 被查找的字符在在父串首次出现的位置（索引值）可选
//省略则从首字符开始查
//等于0从0开始查，没有则返回-1 有则返回索引值
//结果为 9
console.log(str.indexOf('ld',6));
  1. 查找指定索引的字符
    string.chartAt(index) 
//结果为e 超过字符串的索引值返回空字符串
//索引值从0开始
console.log(str.charAt(1));

string.lastIndexOf(searchvalue,start)

//与上一个方法类似 但是是倒序查找
//start取值从0开始
//省略则从最后一个开始检索
console.log(str.lastIndexOf('l',2));
  1. 转大小写
    string.toLowerCase(); 转小写
    string.toUpperCase()); 转大写 
//全部转为小写 hello world
console.log(str.toLowerCase());
//全部转为大写 HELLO WORLD
console.log(str.toUpperCase());
数组方法
  1. 合并数组
    arr.concat(item, item) 
//合并数组 返回新的数组 不会改变原来数组的值
var arr1 = [1,3,5,6];
var arr2 = ["a","b","c","d"];
console.log(arr1.concat(arr2));
console.log(arr1);
//上面两句控制台输出结果
//(8) [1, 3, 5, 6, "a", "b", "c", "d"]
// (4) [1, 3, 5, 6]
  1. 给数组添加分隔符
    arr.join("要加的分隔符") 
//将数组中的元素按指定的符号连接，默认是逗号
//返回连接的字符串
 var arry = [5,6,9,8];
console.log(arry.join("--"));
//结果 5--6--9--8
  1. 删除数组末尾的值
    arr.pop() 
//返回删除的值
//对空数组操作，返回undefined
var arry = [5,6,9,8];
console.log(arry.pop());  // 8
console.log(arry);  // (3) [5, 6, 9]
  1. 在数组末尾添加
    arr.push() 
//返回数组添加后的长度
var arr3 = [1,4,7,8];
console.log(arr3.push("yan"));  // 5
console.log(arr3); // (5) [1, 4, 7, 8, "yan"]

5.删除数组第一个元素的值
arr.shift()

 //返回删除的值
 //对空数组操作，返回undefined
let arr4 = [1,5,7,8];
console.log(arr4.shift()); // 1

6.给数组开始位置添加值
arr.unshift(value)

 //返回添加值后数组的长度
 //可以一次性添加多个元素，添加的值用在引号外用,隔开，分别用引号包含
let arr5 = [1,5,6,9];
console.log(arr5.unshift('1',2,'7')); // 7

7.替换数组中的元素
arr.splice(startIndex,deletCount,values)

 // 1.startIndex 开始处理数据的位置
 // 2.deletCount 删除的数量 包含开始位置
 // 3.values 要添加的值
 //返回数组，存放删除的元素
let arr6 = [1,5,8,9];
console.log(arr6.splice(1,2,'55')); // (2) [5, 8]
console.log(arr6); // (3) [1, "55", 9]

8.截取元素
slice(startIndex,endIndex)

 //1.start 为负数，倒数第一为-1，从右向左数，负几倒数第几开始
 //2.结束位置，省略，则截取到最后一位结束位置不截取
 //3.返回数组，内容为截取出来的元素
 let arr7 = [1,4,6,8,0];
 console.log(arr7.slice(2,4));  // (2) [6, 8]

ES6中的新增的字符串和数组方法

新增字符串方法

let str= '非常';
let blog = '非常高兴你能看到这篇文章!';
1.查找是否存在

 document.write(blog.includes(str)); // true

2.查找开头是否存在

 document.write(blog.startsWith(str)); // true

3.查找结尾是否存在

 document.write(blog.endsWith(str)); // false

4.字符串复制

 document.write('str|'.repeat(21));
新增数组方法
json数组格式
 let json = {
     '0': '学习',
     '1': '前端',
     '2': 'ES6知识',
     length: 3
 }

1.把json数组格式转化为数组

 let arr = Array.from(json);
 console.log(arr);

2.Array.of方法

//'3,4,5,6' 不是想要的数组格式
 let arr = Array.of(3, 4, 5, 6);
 console.log(arr);
//'[3,4,5,6]' 这种字符串格式
 let stt = '[3,4,5,6]'; // (4) [3, 4, 5, 6]
//旧方法
 let arr = eval(arr);
//使用Arrayof就可以转换
//文字同样也可以进行转换
 let arr = Array.of('学习','前端开发');
 console.log(arr); // (2) ["学习", "前端开发"]

3.find() 实例方法 数组元素查找

//find接收一个回调方法
//方法里的参数
//value 当前查找的值
//index 这个值的索引
//arr 数组原型
 let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
 console.log(arr.find(function(value,index,arr){
     return value >10; 返回满足条件的第一个元素
     //没有满足条件的 返回 undefined
 })); // undefined

//用find()查找字符串
 let arr = ['移动', 'ES6', '前端学习'];
 console.log(arr.find(function (value, index, arr) {
     return value == 'eng'; //返回满足条件的第一个元素
     //没有满足条件的 返回 undefined
 })); // undefined
  1. fill 实例方法 填充替换
 let arr = ['移动','ES6','前端学习'];
 arr.fill('web',1,3); // fill(替换字符,替换的位置,替换到哪个位置)
 console.log(arr);// (3) ["移动", "web", "web"]

5.数组循环

//此处的arr为4.里面的arr数组
 for (let item of arr) { //输出数组下标 arr.keys()
     console.log(item);
 }
//下标和元素一起输出 arr.entries()
 for (let [index,val] of arr.entries()) {
     console.log(`${index}:${val}`);
 }

6.entries() 实例方法 手动进行循环

 let list = arr.entries();
 console.log(list); //生成Array Iterator?{}格式 支持手动循环
// 要生成不规则循环 生成条目
 console.log(list.next().value);
 console.log('----------------');
 console.log(list.next().value);
 console.log('****************');
 console.log(list.next().value);
 console.log('6666666666666666');
©著作权归作者所有,转载或内容合作请联系作者
  • 人面猴
    序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
    沈念sama阅读 214,504评论 6赞 496
  • 死咒
    序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
    沈念sama阅读 91,434评论 3赞 389
  • 救了他两次的神仙让他今天三更去死
    文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
    开封第一讲书人阅读 160,089评论 0赞 349
  • 道士缉凶录：失踪的卖姜人
    文/不坏的土叔 我叫张陵，是天一观的道长。 经常有香客问我，道长，这世上最难降的妖魔是什么？ 我笑而不...
    开封第一讲书人阅读 57,378评论 1赞 288
  • 港岛之恋（遗憾婚礼）
    正文 为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
    茶点故事阅读 66,472评论 6赞 386
  • 恶毒庶女顶嫁案：这布局不是一般人想出来的
    文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
    开封第一讲书人阅读 50,506评论 1赞 292
  • 城市分裂传说
    那天，我揣着相机与录音，去河边找鬼。 笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。 我是一名探鬼主播，决...
    沈念sama阅读 39,519评论 3赞 413
  • 双鸳鸯连环套：你想象不到人心有多黑
    文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
    开封第一讲书人阅读 38,292评论 0赞 270
  • 万荣杀人案实录
    序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
    沈念sama阅读 44,738评论 1赞 307
  • 护林员之死
    正文 独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,022评论 2赞 329
  • 白月光启示录
    正文 我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,194评论 1赞 342
  • 活死人
    序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
    沈念sama阅读 34,873评论 5赞 338
  • 日本核电站爆炸内幕
    正文 年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
    茶点故事阅读 40,536评论 3赞 322
  • 男人毒药：我在死后第九天来索命
    文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,162评论 0赞 21
  • 一桩弑父案，背后竟有这般阴谋
    文/苍兰香墨 我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,413评论 1赞 268
  • 情欲美人皮
    我被黑心中介骗来泰国打工， 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。 一个月前我还...
    沈念sama阅读 47,075评论 2赞 365
  • 代替公主和亲
    正文 我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
    茶点故事阅读 44,080评论 2赞 352

推荐阅读更多精彩内容

  • 花事一二
    1 厨房的窗台上水培了四头蒜，养在了以前喝水的大肚子小猪水杯里，出苗时亭亭玉立，煞是好看。一杯小小的绿植，给厨房添...
    烈烈清酒阅读 116评论 0赞 0
  • There is a big difference between an affirmatio...
    断言和问题之间有巨大差别。 今天的早读内容不难，关于affirmation ，暂且翻译为断言，怎么翻译更好呢？ 花...
    然妈Miya阅读 776评论 2赞 3
  • 2019-03-21随想点滴
    没想到《千与千寻》的音乐开篇那好听的声音原来是单簧管发出来的。 那声音时而可爱，跳跃，时而婉转悠长 一下子就把我带...
    暂人间阅读 67评论 0赞 0