前端笔记(3) Javascript 字符串函数 数组函数
2023-09-27 14:26:50 时间
1. 字符串函数
/*
第一个字符位置为 0, 第二个字符位置为 1
返回在指定位置的符
*/
testCharAt() {
const str = "Hello World!";
let a = str.charAt(0);//H
let b = str.charAt(30);//""
console.log(a);
console.log(b);
},
//连接两个或更多字符串,并返回新的字符串。
testConcat() {
let a = "Hello ";
let b = "World";
let c = a.concat(b);
console.log(a);//Hello
console.log(b);//World
console.log(c);//Hello World
},
//返回某个指定的字符串值在字符串中首次出现的位置。
//不包含则返回-1
testIndexOf() {
let a = "Hello World";
console.log(a.indexOf("ll"));//2
console.log(a.indexOf(" "));//5
console.log(a.indexOf("Wor"));//6
console.log(a.indexOf("wor"));//-1
console.log(a.indexOf("www"));//-1
},
//查找字符串中是否包含指定的子字符串
testIncludes() {
let a = "Hello World";
console.log(a.includes("Wor"));//true
console.log(a.includes("wor"));//false
},
testLastIndexOf() {
let a = "Hello World";
console.log(a.lastIndexOf("Wor"));//6
console.log(a.lastIndexOf("wor"));//-1
},
testReplace() {
let a = "Hello World";
console.log(a.replace("World", "Pigg"));//Hello Pigg
},
//slice(start, end) 方法可提取字符串的某个部分,并以新的字符串返回被提取的部分。
//使用 start(包含) 和 end(不包含) 参数来指定字符串提取的部分。
//字符串中第一个字符位置为 0, 第二个字符位置为 1, 以此类推。
testSlice() {
let a = "Hello World";
let b = a.slice(1, 3);
console.log(a);//Hello World
console.log(b);//el
},
//把一个字符串分割成字符串数组
testSplit() {
let a = "Hello World";
let b = a.split(" ");
console.log(a);//Hello World
console.log(b);//["Hello", "World"]
},
testStartsWith() {
let a = "Hello World";
console.log(a.startsWith("Hel"));//true
console.log(a.startsWith("hel"));//false
},
//substr() 方法可在字符串中抽取从 开始 下标开始的指定数目的字符。
//statr参数必需。要抽取的子串的起始下标。必须是数值
//第二个参数length可选。子串中的字符数。必须是数值。如果省略了该参数,那么返回从 stringObject 的开始位置到结尾的字串。
testSubstr() {
let a = "Hello World";
let b = a.substr(1, 3);
let c = a.substr(1);
console.log(a);//Hello World
console.log(b);//ell
console.log(c);//ello World
},
//substring() 方法用于提取字符串中介于两个指定下标之间的字符。
//substring() 方法返回的子串包括 开始 处的字符,但不包括 结束 处的字符。
testSubstring() {
let a = "Hello World";
let b = a.substring(1, 3);
let c = a.substring(1);
console.log(a);//Hello World
console.log(b);//el
console.log(c);//ello World
}
2 数组函数
let vm = new Vue({
el: "#app1",
data: {
arr: [1, 2, 3, 4],
message: "hello vue.js!!!"
},
methods: {
checkMoreThanTwo(num) {
return num > 2;
},
//concat() 方法用于连接两个或多个数组。
//该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。
testContact() {
let a = ["a", "aa"];
let b = ["b", "bb"];
let c = a.concat(b);
console.log(a);//["a", "aa"]
console.log(b);//["b", "bb"]
console.log(c);//["a", "aa", "b", "bb"]
},
//判断一个数组是否包含一个指定的值
testIncludes() {
let a = ["a", "aa"];
console.log(a.includes("a"));//true
console.log(a.includes("aaa"));//false
},
//通过指定函数处理数组的每个元素,并返回处理后的数组。
//map不改变原始数组,不对空数组检测
//它返回一个新数组
testMap() {
let newMapArr = this.arr.map(function (item) {
return item * 2;
})
this.message = newMapArr;
},
//删除数组的最后一个元素并返回删除的元素
testPop() {
let a = ["a", "aa"];
let b = a.pop();
console.log(a);//["a"]
console.log(b);//aa
},
//push() 方法可向数组的末尾添加一个或多个元素,并返回新的长度
testPush() {
let a = ["a", "aa"];
let b = a.push("aaa", "aaaa");
console.log(a);//["a", "aa", "aaa", "aaaa"]
console.log(b);//4
},
testFind() {
//find是找到第一个符合条件的成员
let arr2 = this.arr.find((n) => n > 1);
this.message = arr2;
},
testFindIndex() {
//findIndex是找到第一个符合条件的成员位置,index从0开始
let index = this.arr.findIndex((n) => n > 0);
this.message = index;
},
testFilter() {
//filter创建符合条件的新数组
let filterArr = this.arr.filter((n) => n > 3);
this.message = filterArr;
},
testSome() {
//只要有一个满足条件就返回true
let someMoreThanTwo = this.arr.some(this.checkMoreThanTwo);
this.message = someMoreThanTwo;
},
testEvery() {
//所有满足条件就返回true
let allMoreThanTwo = this.arr.every(this.checkMoreThanTwo);
this.message = allMoreThanTwo;
},
testForEach() {
this.arr.forEach(function (item, index, input) {
input[index] = item * 2;
})
this.message = this.arr;
}
}
});
相关文章
- Java程序猿的JavaScript学习笔记(12——jQuery-扩展选择器)
- JavaScript 刚開始学习的人应知的 24 条最佳实践
- 【学习笔记07】JavaScript数据类型强制转化
- 【学习笔记28】JavaScript数组字符串面试题
- 【学习笔记35】JavaScript计算两个指定日期的时间差
- 【学习笔记65】JavaScript的继承
- 在Js(JavaScript)和aspx中引用Asp.Net的.cs文件中传过来的变量参数!(实例)
- 前端开发面试题—JavaScript闭包
- JavaScript、jQuery实现“社区便利店收银系统”(1+X Web前端开发初级 例题)
- Javascript权威指南阅读笔记--第3章类型、值和变量(1)
- HTML5 + CSS3 + JavaScript
- Web前端-JavaScript基础教程上
- 简单粗暴的JavaScript笔记-1
- JavaScript代码笔记重点:
- Javascript 笔记与总结(2-6)var
- Javascript 笔记与总结(1-5)闭包
- 《众妙之门——JavaScript与jQuery技术精粹》——2.7 总结
- 《JavaScript设计模式》——11.3 站长统计
- 《JavaScript框架设计》——2.2 加载器所在路径的探知
- [学习笔记]Javascript采用二进制浮点数和四舍五入的错误
- JavaScript权威指南学习笔记3
- JS教程之 识别 JavaScript 数据类型:两种方法就足够了
- Dynamic CRM 2013学习笔记(十一)利用Javascript实现子表合计(汇总,求和)功能
- javascript闭包传参就这么简单
- JavaScript学习笔记之二(DOM API)
- 华为OD机试 - 端口合并(JavaScript) | 机试题+算法思路+考点+代码解析 【2023】
- 华为OD机试 -满足规则的数组组合(JavaScript) | 机试题+算法思路+考点+代码解析 【2023】
- 以小见大、由浅入深-谈如何面试Javascript工程师
- 【web前端(三十五)】javascript_文档对象模型中查找元素的API(BOM对象与DOM的混用)及在标签内添加文档的操作
- 把C编译成javascript的方法
- 一文入门 —— JavaScript
- JavaScript 模块化历程