对象
1、对象
为什么要有对象?
- 如果有一组相关的数据，松散的存储不利于使用，存入数组中受下标限制又必须有固定的 顺序，而对象可以自定义名称存储一系列无序的相关数据。
什么是对象?
现实生活中的对象:万物皆对象，对象是一个具体的事物，一个具体的事物就会有行为和特征。
举例: 一部车，一个手机
车是一类事物，门口停的那辆车才是对象
特征:红色、四个轮子
行为:驾驶、刹车
JavaScript 中的对象:
- JavaScript 中的对象其实就是生活中对象的一个抽象。 JavaScript 的对象是无序属性的集合。
- 其属性可以包含基本值、对象或函数。对象就是一组没有顺序的值。我们可以把JavaScript中的对象 想象成键值对，其中值可以是数据和函数。
- 对象的行为和特征:
- 特征---在对象中用属性表示
- 行为---在对象中用方法表示
2、对象字面量
- 创建一个对象最简单的方式是使用对象字面量赋值给变量。类似数组。
- 对象字面量语法:{}
- 内部可以存放多条数据，数据与数据之间用逗号分隔，最后一个后面不要加逗号。
- 每条数据都是有属性名和属性值组成，键值对写法:k: v
- k:属性名
- v:属性值，可以是任意类型的数据，比如简单类型数据、函数、对象。
//对象语法
var obj = {
k: v,
k: v,
k: v
};
// 通过对象字面量方式创建一个对象
var person1 = {
name : "zs",
age : 18,
sex : "male",
sayHi : function () {
console.log(this.name + "向你说您好");
}
};
区分属性和方法
- 属性:对象的描述性特征，一般是名词，相当于定义在对象内部的变量。
- 方法:对象的行为和功能，一般是动词，定义在对象中的函数。
3、调用对象内部属性和方法的语法
- 用对象的变量名打点调用某个属性名，得到属性值。
- 在对象内部用 this 打点调用属性名。this 替代对象。
- 用对象的变量名后面加 [] 调用，[] 内部是字符串格式的属性名。
- 调用方法时，需要在方法名后加 () 执行。
// 调用对象的属性和方法
console.log(person1.name);
console.log(person1.age);
console.log(person1.sex);
person1.sayHi();
// 中括号调用方法
console.log(person1["name"]);
person1["sayHi"]();
person1.sayHi();
更改对象内部属性和方法的语法
-
更改属性的属性值方法:先调用属性，再等号赋值。 o.age = 19;
-
增加新的属性和属性值:使用点语法或者[]方法直接定义新属性，等号赋值。 o.height = 180;
-
删除一条属性:使用一个 delete 关键字，空格后面加属性调用。 delete o.sex;
// 更改数据
person1.age = 19;
// 添加新数据
person1.weight = 140;
// 删除属性
delete person1.sex;
console.log(person1);
4、其他创建对象的方式
new Object() 创建对象
Object()构造函数，是一种特殊的函数。主要用来在创建对象时初始化对象，即为对象成员变量赋初始值，总与new 运算符一起使用在创建对象的语句中。-
- 构造函数用于创建一类对象，首字母要大写。
-
- 构造函数要和 new 一起使用才有意义。
-
// 通过对象字面量方式创建一个对象
var person1 = {
name : "zs",
age : 18,
sex : "male",
sayHi : function () {
console.log(this.name + "向你说您好");
}
};
// new Object() 方法创建
var person1 = new Object(); //创建了一个新的空的对象
// 添加属性和方法
person1.name = "zs";
person1.age = 18;
person1.sex = true;
person1.sayHi = function () {
console.log("你好");
};
// 输出
console.log(person1);
new 在执行时会做四件事情
- new 会在内存中创建一个新的空对象
- new 会让 this 指向这个新的对象
- 执行构造函数 目的:给这个新对象加属性和方法
- new 会返回这个新对象
工厂函数创建对象
- 如果要创建多个类似的对象，可以将 new Object() 过程封装到一个函数中，将来调用函数就 能创建一个对象，相当于一个生产对象的函数工厂，用来简化代码。
// 工厂方法就是相当于对 new Object() 方法的一个封装
function createPerson(name,age,sex) {
// 创建一个空对象
var person = new Object();
// 添加属性和方法，属性可以接受参数的值
person.name = name;
person.age = age;
person.sex = sex;
person.sayHi = function () {
console.log("hello");
};
// 将对象作为函数的返回值
return person;
}
// 想创建一个对象，可以调用工厂函数
var p1 = createPerson("zs",18,true);
var p2 = createPerson("ls",19,false);
// 输出
console.log(p1);
{name: 'zs', age: 18, sex: true, sayHi: ƒ}age: 18name: "zs"sayHi: ƒ ()sex: true[[Prototype]]: Object
console.log(p2);
自定义构造函数
- 比工厂方法更加简单。
- 自定义一个创建具体对象的构造函数，函数内部不需要 new 一个构造函数的过程，直接使用 this 代替对象进行属性和方法的书写，也不需要 return 一个返回值。
- 使用时，利用 new 关键字调用自定义的构造函数即可。
- 注意:构造函数的函数名首字母需要大写，区别于其他普通函数名。
// 自己定义一个构造函数
function Person(name,age,sex) {
// 不需要使用 new 一个新对象
// 用 this 替代将来创建的新对象
this.name = name;
this.age = age;
this.sex = sex;
this.sayHi = function () {
console.log("hello");
};
// 不需要添加 return
}
// 用 new 关键字调用构造函数
var p1 = new Person("zs",18,true);
console.log(p1);
5、对象遍历
- for in循环也是循环的一种，专门用来遍历对象，内部会定义一个k变量，k变量在每次循 环时会从第一个开始接收属性名，一直接收到最后一条属性名，执行完后跳出循环。
- 简单的循环遍历:输出每一项的属性名和属性值。 // 循环遍历输出每一项
for(var k in obj){
console.log(k + "项的属性值是" + obj[k]);
}
// 通过对象字面量方式创建一个对象
var person1 = {
name : "zs",
age : 18,
sex : "male",
sayHi : function () {
console.log(this.name + "向你说您好");
}
};
// 遍历对象
for (var k in person1) {
// k 存储的是每一条数据的属性名或者方法名
console.log(person1[k]);
}
结果：zs
18
male
ƒ () {
console.log(this.name + "向你说您好");
}
// 通过对象字面量方式创建一个对象
var person1 = {
name : "zs",
age : 18,
sex : "male",
sayHi : function () {
console.log(this.name + "向你说您好");
}
};
// 遍历对象
for (var k in person1) {
// k 存储的是每一条数据的属性名或者方法名
console.log(k + "属性的属性值为" + person1[k]);
}
结果：name属性的属性值为zs
age属性的属性值为18
sex属性的属性值为male
sayHi属性的属性值为function () {
console.log(this.name + "向你说您好");
}
6、简单类型和复杂类型
- 我们已经学习过简单类型数据和一些复杂类型的数据，现在来看一下他们之间的区别有哪些。
- 基本类型又叫做值类型，复杂类型又叫做引用类型
- 值类型:简单数据类型，基本数据类型，在存储时，变量中存储的是值本身，因此叫做值类型。
- 引用类型:复杂数据类型，在存储时，变量中存储的仅仅是地址(引用)，因此叫做引用数据类型。
堆和栈（js中没有堆和栈）
- 栈(操作系统):由操作系统自动分配释放 ，存放函数的参数值，局部变量的值等。
- 堆(操作系统): 存储复杂类型(对象)，一般由程序员分配释放， 若程序员不释放，由垃圾回收机制回收。
基本类型在内存中的存储
- 变量中如果存储的是简单类型的数据，那么变量中存储的是值本身，如果将变量赋值给另一个变量，是将内部的值复制一份给了另一个变量，两个变量之间没有联系，一个变化，另一个不会同时变化。
// 基础数据类型
a 和 b 之间并没有关联，a只是将最开始的值给了b,但a发生改变，b不会受影响
var a = 5;
var b = a; //将 a 内部存储的数据 5 复制了一份给 b
a = 10;
console.log(a); 10
console.log(b); 5
复杂类型在内存中的存储
- 如果将复杂类型的数据赋值给一个变量，复杂类型的数据会在内存中创建一个原型，而变量 中存储的是指向对象的一个地址，如果将变量赋值给另一个变量，相当于将地址复制一份给 了新的变量，两个变量的地址相同，指向的是同一个原型，不论通过哪个地址更改了原型， 都是在原型上发生的更改，两个变量下次访问时，都会发生变化。
// 复杂数据类型
var p1 = {
name : "zs",
age : 18,
sex : "male"
};
var p = p1; //p1 将内部存储的指向对象原型的地址复制给了 p
// 两个变量之间是一个联动的关系，一个变化，会引起另一个变化
p.name = "ls";
console.log(p);
console.log(p1);
// 数组和函数存储在变量中时，也是存储的地址
var arr = [1,2,3,4];
var arr2 = arr;
arr[4] = 5;
console.log(arr);
console.log(arr2);
内置对象
- 复习
1、MDN
- Mozilla 开发者网络(MDN)提供有关开放网络技术(Open Web)的信息，包括 HTML、CSS 和万维网及 HTML5 应用的 API。
- MDN: developer.mozilla.org/zh-CN/
- 比如:通过查询MDN学习Math对象的random()方法的使用
-
方法的功能
-
参数的意义和类型
-
返回值意义和类型
-
demo 进行测试
-
// 内置对象
console.log(Math);
// 通过查询手册进行学习
console.log(Math.random());
// 使用 MDN 中的示例，快速进行代码书写
function getRandomArbitrary(min, max) {
return Math.random() * (max - min) + min;
}
console.log(getRandomArbitrary(10,20));
2、Math对象方法
- Math对象它具有数学常数和函数的属性和方法，我们可以直接进行使用
- 根据数学相关的运算来找 Math 中的成员(求绝对值，取整)
developer.mozilla.org/en-US/docs/…
Math是一个内置对象，具有数学常数和函数的属性和方法。它不是一个函数对象。
Math与[Number]类型一起使用。它不适用于[BigInt]
| Math.PI | 圆周率 |
|---|---|
| Math.random() | 生成随机数 |
| Math.floor() / Math.ceil() | 向下取整/向上取整 |
| Math.round() | 取整，四舍五入 |
| Math.abs() | 绝对值 |
| Math.max() / Math.min() | 求最大和最小值 |
| Math.sin() / Math.cos() | 正弦/余弦 |
| Math.power() / Math.sqrt() | 求指数次幂/求平方根 |
// 一个半径为10的圆的周长
// 圆周率
console.log(2 * 10 * Math.PI);
// 随机数
function getRandomIntInclusive(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min + 1)) + min; //含最大值，含最小值
}
console.log(getRandomIntInclusive(10,20));
// 四舍五入取整
console.log(Math.round(4.3));
console.log(Math.round(4.7));
// 绝对值
console.log(Math.abs(-90));
// 获取最大值和最小值
console.log(Math.max(45,67,34,90,123,33));
console.log(Math.min(45,67,34,90,123,33));
// 求一个数的几次方
console.log(Math.pow(3,4));
// 平方根
console.log(Math.sqrt(4));
console.log(Math.pow(4,1/2));
Math.sqrt(9); // 3
Math.sqrt(2); // 1.414213562373095
Math.sqrt(1); // 1
Math.sqrt(0); // 0
Math.sqrt(-1); // NaN
Math.sqrt(-0); // -0
3、new Array() 构造函数方法
// 字面量方法
var arr = [1,2,3];
// 数组也是对象，可以通过构造函数生成
// 空数组
var arr1 = new Array();
// 添加数据，可以传参数
var arr2 = new Array(1,2,3);
var arr3 = new Array("zs","ls","ww");
console.log(arr1);
console.log(arr2);
console.log(arr3);
// 检测数组的数据类型
console.log(typeof(arr));
console.log(typeof(arr3));
这种检测方式检测出来 // expected output: Object; object范围有点大，但是想检测函数是不是某种构造函数,是哪种具体的对象类型
检测数据类型
- instanceof 检测某个实例是否是某个对象类型
// 数组也是对象，可以通过构造函数生成
// 空数组
var arr1 = new Array();
// 添加数据，可以传参数
var arr2 = new Array(1,2,3);
var arr3 = new Array("zs","ls","ww");
console.log(arr1);
console.log(arr2);
console.log(arr3);
var a = {};
// 检测某个实例对象是否属于某个对象类型
console.log(arr instanceof Array); true
console.log(arr2 instanceof Array); true
console.log(a instanceof Array); false
// 检测某个实例对象是否属于某个对象类型
function fun () {
console.log(1);
}
console.log(fun instanceof Function); true
• toString() 把数组转换成字符串，逗号分隔每一项
// 字面量方法
var arr = [1,2,3,4];
// toString() 方法：转字符串
console.log(arr.toString());
expected output:1,2,3,4
数组常用方法-首尾操作办法
// 字面量方法
var arr = [1,2,3,4];
// toString() 方法：转字符串
console.log(arr.toString());
// 首尾操作方法
// 尾推,参数是随意的，可以有一个或多个
arr.push(5,6,7,8); 加了4个数据，但是此时没有打印所以控制台没有值
console.log(arr);
--- expected output:1,2,3,4,5,6,7,8;
console.log(arr.push(5,6,7,8));
--- expected output:8;push完新的数组的长度
console.log(arr);
--- expected output:1,2,3,4,5,6,7,8;
console.log(arr.push([5,6,7,8]));
--- expected output:5;push完新的数组的长度
如果在push后面加的是数组，那么输出结果会将push后面的数组作为一项数组放后面
例如下图
// 字面量方法
var arr = [1,2,3,4];
// 尾删，删除最后一项数据
// 不需要传参
console.log(arr.pop());
console.log(arr);
// 字面量方法
var arr = [1,2,3,4];
// 首删，删除第一项数据，不需要传参
console.log(arr.shift());
console.log(arr);
// 字面量方法
var arr = [1,2,3,4];
// 首添，参数与 push 方法类似
console.log(arr.unshift(-1,0));
console.log(arr);
// 字面量方法
var arr = [1,2,3,4];
// 将数组的第一项移动到最后一项
// 删除第一项
// 将删除的项添到最后一项
arr.push(arr.shift());
console.log(arr);
// 字面量方法
var arr = [1,2,3,4];
// 将数组的第一项移动到最后一项
// 删除第一项
// 将删除的项添到最后一项
arr.push(arr.shift());
console.log(arr);
arr.push(arr.shift());
console.log(arr);
arr.push(arr.shift());
console.log(arr);
arr.push(arr.shift());
console.log(arr);
数组方法- 合并和拆分方法
- concat()
- 将两个数组合并成一个新的数组，原数组不受影响。参数位置可以是一个数组字面量、数 组变量、零散的值。
// 字面量方法
var arr = [1,2,3,4];
// 合并方法
// 参数：数组、数组的变量、零散的值
// 返回值：一个新的拼接后的数组
var arr1 = arr.concat([5,6,7]);
console.log(arr);
expected output:(4) [1, 2, 3, 4]
console.log(arr1);
expected output:(7) [1, 2, 3, 4, 5, 6, 7]
// 字面量方法
var arr = [1,2,3,4];
// 合并方法
// 参数：数组、数组的变量、零散的值
// 返回值：一个新的拼接后的数组
var ar = [8,9,10]
var arr1 = arr.concat(ar); //把数组ar拼接到arr后新的数组，返回给arr1
console.log(arr);
expected output:(4) [1, 2, 3, 4]
console.log(arr1);
expected output:(7) [1, 2, 3, 4, 8, 9, 10]
- slice(start,end)
- 从当前数组中截取一个新的数组，不影响原来的数组，返回一个新的数组，包含从 start 到end (不包括该元素)的元素。
- 参数区分正负，正值表示下标位置，负值表示从后面往前数第几个位置，参数可以只传递一个，表示从开始位置截取到字符串结尾。
// 字面量方法
var arr = [1,2,3,4,5,6,7,8,9,10];
// 拆分方法
// 参数为正
var arr1 = arr.slice(3,7);
console.log(arr);
expected output:(10) [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
console.log(arr1);
expected output:(4) [4, 5, 6, 7]
// 参数为负 -1的位置不取
var arr1 = arr.slice(-7,-1);
console.log(arr1);
expected output:(6) [4, 5, 6, 7, 8, 9]
// 参数为负 -1的位置在前，实际位置在后，-7的实际位置在-1前
var arr1 = arr.slice(-1,-7);
console.log(arr1);
expected output:[]，得到一个空
// 只书写一个参数 从倒数第7的位置取到最后一位
var arr1 = arr.slice(-7);
console.log(arr1);
expected output:(6) [4, 5, 6, 7, 8, 9, 10]
数组方法- splice和位置方法
- 删除、插入、替换:
- splice(index,howmany,element1,element2,......)
- 用于插入、删除或替换数组的元素
- index:删除元素的开始位置
- howmany:删除元素的个数，可以是0
- element1,element2:要替换的新的数据
//表示从下标为3的位置开始，往后删5个数
// 字面量方法
var arr = [1,2,3,4,5,6,7,8,9,10];
// 删除功能，传前两个参数
arr.splice(2,5);
console.log(arr);
expected output:(5) [1, 2, 8, 9, 10]
//或者直接打印arr.splice(2,5);
console.log(arr.splice(2,5));
expected output:(5) [1, 2, 8, 9, 10]
// 字面量方法
var arr = [1,2,3,4,5,6,7,8,9,10];
// 替换功能，传3个及以上的参数
arr.splice(2,5,"haha","hello");
console.log(arr);
expected output:(7) [1, 2, 'haha', 'hello', 8, 9, 10]
// 字面量方法
var arr = [1,2,3,4,5,6,7,8,9,10];
// 插入功能，传3个及以上的参数，但是第二个参数必须为0
arr.splice(2,0,"hello");
console.log(arr);
expected output:(11) [1, 2, 'hello', 3, 4, 5, 6, 7, 8, 9, 10]
数组方法— 位置方法:
- indexOf() :查找数据在数组中最先出现的下标
- lastIndexOf() :查找数据在数组中最后一次出现的下标
- 注意:如果没找到返回-1
// 字面量方法
var arr = [1,2,3,4,5,6,7,8,9,10,4,5];
// 查找某个元素在数组中从前往后第一次 出现位置的下标
console.log(arr.indexOf(4));
expected output:3
// 查找某个元素在数组中从前往后最后一次出现位置的下标
console.log(arr.lastIndexOf(4));
expected output:10
//找不到的值输出-1
console.log(arr.lastIndexOf(11));
expected output:-1
数组方法- 倒序reverse() 和排序sort()
- 倒序:reverse() 将数组完全颠倒，第一项变成最后一项，最后一项变成第一项。
// 字面量方法
var arr = [1,2,3,4,5,6,7,8,9,10,20,30];
// 倒序排列
arr.reverse();
console.log(arr);
expected output:(12) [30, 20, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1]
//或者直接打印，也是一样的结果
console.log(arr.reverse());
expected output:(12) [30, 20, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1]
- 排序:sort(); 默认根据字符编码顺序，从小到大排序
// 字面量方法
var arr = [1,2,3,4,5,6,7,8,9,10,20,30];
// 排序，默认按照字符编码顺序从小到大排列
arr.sort();
console.log(arr);
expected output: (12) [1, 10, 2, 20, 3, 30, 4, 5, 6, 7, 8, 9]
- 如果想要根据数值大小进行排序，必须添加sort的比较函数参数。
- 该函数要比较两个值，然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具 有两个参数 a 和 b，根据a和b的关系作为判断条件，返回值根据条件分为三个分支，正数、 负数、0:
- 返回值是负数-1: a排在b前面。
- 返回值是正数1:a排在b后面。
- 返回值是0:a和b的顺序保持不变。
- 人为能控制的是判断条件。
// 字面量方法
var arr = [1,2,3,4,5,6,7,8,9,10,20,30];
// 添加一个比较函数的参数
arr.sort(function(a,b){
if (a < b) {
return -1; //表示 a 要排在 b 前面
} else if (a > b) {
return 1; //表示 a 要排在 b 后面
} else {
return 0; //表示 a 和 b 保持原样，不换位置
}
});
console.log(arr);
expected output:(12) [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 20, 30]
如果要降序
// 添加一个比较函数的参数
arr.sort(function(a,b){
if (a > b) {
return -1; //表示 a 要排在 b 前面
} else if (a < b) {
return 1; //表示 a 要排在 b 后面
} else {
return 0; //表示 a 和 b 保持原样，不换位置
}
});
console.log(arr);
expected output:(12) [30, 20, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1]
数组方法- 转字符串方法
- 转字符串方法:将数组的所有元素连接到一个字符串中。
- join() 通过参数作为连字符将数组中的每一项用连字符连成一个完整的字符串
// 字面量方法
var arr = [1,2,3,4,5,6,7,8,9,10,20,30];
// 转字符串方法
var str = arr.join();
console.log(str);
expected output: 1,2,3,4,5,6,7,8,9,10,20,30
// 转字符串方法 join("*")
var str = arr.join("*");
console.log(str);
expected output: 1*2*3*4*5*6*7*8*9*10*20*30
// 转字符串方法 join("")
var str = arr.join("");
console.log(str);
expected output: 123456789102030
数组方法- 清空数组
| 方式1 推荐 | arr = []; |
|---|---|
| 方式2 | arr.length = 0; |
| 方式3 | arr.splice( 0, arr.length ); |
// 清空数组
arr = [];
console.log(arr); []
arr.length = 0;
console.log(arr); []
arr.splice(0,arr.length);
console.log(arr); []
4、String对象
基本包装类型
- 为了方便操作简单数据类型，JavaScript 还提供了特殊的简单类型对象:String 基本类型是没有方法的。
- 当调用 str.substring() 等方法的时候，先把 str 包装成 String 类型的临时对象，再调用substring 方法，最后销毁临时对象。
- 可以使用 new String() 构造函数方法创建字符串对象。
// 基本类型的数据：没有属性和方法
// 对象数据类型：有属性和方法
// 但是字符串是可以调用一些属性和方法
var str = "这是一个字符串";
var str2 = str.slice(3,5);
console.log(str2);
expected output:个字
var str = "这是一个字符串";
// 基本包装类型：基本类型的数据在进行一些特殊操作时，会暂时被包装成一个对象，结束后再被销毁
// 字符串也有一种根据构造函数创建的方法
var str3 = new String("abcdef");
console.log(str);
console.log(str3);
// 模拟计算机的工作
var str = "这是一个字符串";
// 进行了一个临时的包装
var str4 = new String(str);
var str2 = str4.slice(3,5);
str4 = null;
在执行var str = "这是一个字符串";这一串代码过程中，首先一开始是定义了一个字符串，在它进行方法调用之前进行了一个临时的包装，给了一个新的str4这样的变量去接收包装的临时对象，也就是用new String()进行包装，让str4去做调用slice方法的工作，str2是对str4这种包装过后的对象进行调用的方法，调用完之后，多出来的str4会进行销毁，销毁的方式就是设置一个null,对象为空。
字符串的特点
- 字符串是不可变的。
- 由于字符串的不可变，在大量拼接字符串的时候会有效率问题。
// 定义一个字符串
// 特点：字符串是不可变的
var a = "abc";
a = "cde";
console.log(a);
expected output: cde
// 大量拼接字符串时，会有效率问题
var sum = "";
for (var i = 1 ; i <= 1000000 ; i++) {
sum += i;
}
console.log(sum);
字符串对象常用的方法
- 字符串所有的方法，都不会修改字符串本身(字符串是不可变的)，操作完成会返回一个新的字符串。
字符串属性
- 长度属性:str.length
- 字符串长度指的是一个字符串中所有的字符总数。
// 定义一个字符串
var str = "这是一个普通的字符串，abc， ￥%#";
// 长度属性
console.log(str.length);
expected output: 21
字符串方法- charAt() 方法可返回指定位置的字符。
- char:charator，字符
- at:在哪儿
- 参数是 index 字符串的下标。也是从 0 开始。
- 表示返回指定的下标位置的字符。
// 定义一个字符串
var str = "这是一个普通的字符串，abc， ￥%#";
// charAt() 返回指定下标位置的字符
console.log(str.charAt(6));
expected output: 的
字符串方法- indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。
- 找到指定的子字符串在原字符串中第一次出现的位置的下标。如果子字符串在原字符串中没有，返回值是 -1
// 定义一个字符串
var str = "这是一个普通的字符串，abc， ￥%#";
// indexOf() 返回子串在原始字符串中第一次出现位置的下标
console.log(str.indexOf("字"));
expected output: 7
// indexOf() 返回子串在原始字符串中第一次出现位置的下标
console.log(str.indexOf("字符串"));
expected output: 7
// indexOf() 返回子串在原始字符串中第一次出现位置的下标
console.log(str.indexOf("字 符串"));
expected output: -1
字符串方法- concat() 方法用于连接两个或多个字符串。
- 参数比较灵活，可以是字符串、或者字符串变量、多个字符串。
- 生成的是一个新的字符串，原字符串不发生变化。
// 定义一个字符串
var str = "这是一个普通的字符串，abc， ￥%#";
// concat() 字符串拼接
var str2 = str.concat("哈哈哈","普通");
console.log(str);
console.log(str2);
字符串方法- split() 方法用于把一个字符串分割成字符串数组。
- 参数部分是分割符，利用分割符将字符串分割成多个部分，多个部分作为数组的每一项组成数组。
- 如果分割符是空字符串，相当于将每个字符拆分成数组中的每一项。
// 定义一个字符串
var str = "这是一个普通的字符串，abc， ￥%#";
// split() 分割字符串成一个数组
var arr = str.split(" ");
console.log(arr);
// 定义一个字符串
var str = "这是一个普通的字符串，abc， ￥%#";
// split() 分割字符串成一个数组
var arr = str.split(", ");
console.log(arr);
// 定义一个字符串
var str = "这是一个。普通的字符。abc ￥%#";
// split() 分割字符串成一个数组
var arr = str.split("。");
console.log(arr);
// 字符串内容倒置
var arr = str.split("");
arr.reverse();
str = arr.join("");
// 简写
str = str.split("").reverse().join("");
console.log(str);
expected output: #%￥ cba。符字的通普。个一是这
字符串方法- toLowerCase() 把字符串转换为小写。- toUpperCase() 把字符串转换为大写。
- 将所有的英文字符转为大写或者小写。
- 生成的是新的字符串，原字符串不发生变化。
// 定义一个字符串
var str = "这是一个。普通的字符。abc ￥%#";
// 大小写转换
var str1 = str.toUpperCase();
var str2 = str1.toLowerCase();
console.log(str);
console.log(str1);
console.log(str2);
字符串方法- slice() 方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。
- 语法:slice(start，end)
- 从开始位置截取到结束位置(不包括结束位置)的字符串。
- 参数区分正负，正值表示下标位置，负值表示从后面往前数第几个位置，参数可以只传递一个，表示从开始位置截取到字符串结尾。
// 截取字符串方法：三种
// slice(start,end) 从开始位置截取到结束位置，但是不包含结束位置
var str1 = str.slice(3,7);
console.log(str1);
var str2 = str.slice(-7,-3);
console.log(str2);
var str3 = str.slice(-7);
console.log(str3);
字符串方法- substr() 方法可在字符串中抽取从 start 下标开始的指定数目的字符
- 语法:substr(start,howmany)
- 从开始位置截取到指定长度的字符串。
- start参数区分正负。正值表示下标位置，负值表示从后往前数第几个位置。
- howmany参数必须为正数，也可以不写，不写表示从start截取到最后。
// 定义一个字符串
var str = "这是一个。普通的字符。abc ￥%#";
// substr(start,howmany) 从开始位置截取一定长度
var str2 = str.substr(3,7);
console.log(str2);
// var str3 = str.substr(-9,7);
console.log(str3);
// var str3 = str.substr(-9);
console.log(str3);
字符串方法- substring() 方法用于提取字符串中介于两个指定下标之间的字符。
- 语法:substring(start,end)
- 参数只能为正数。
- 两个参数都是指代下标，两个数字大小不限制，执行方法之前会比较一下两个参数的大小，会用小当做开始位置，大的当做结束位置，从开始位置截取到结束位置但是不包含结束位置。
- 如果不写第二个参数，从开始截取到字符串结尾。
// substring(start,end) 参数必须是整数，比较两个数的大小，小的作为开始，大的作为结束
var str2 = str.substring(3,7);
console.log(str2);
var str3 = str.substring(7,3);
console.log(str3);
var str4 = str.substring(7);
console.log(str4);
