JS总结:数组 字符串 对象
JS中的数据分类:
1)基本数据类型 数据存储在栈区
number, string, boolean, und, null
2)引用数据类型 数据存储在堆区(引用地址在栈区)
array(数组), function(函数), object(对象),、date、regexp等
引用类型数据在栈内存中保存的实际上是对象在堆内存中的引用地址。通过这个引用地址可以快速查找到保存中堆内存中的对象。
array中可以装大量数量,能装大量数据的,叫容器。
在JS中,除了数组容器之外,还有对象容器。
一、数组
1 数组介绍
变量中存储一个数据,数组中可以存储一堆数据。
1.1 数组数据类型:
也是JS中的一种数据类型,是引用数据类型,数据是存储在堆区的。
数组中每一个数据,都有对应的编号,这个编号叫索引,也叫下标。下标默认是从0开始的。
可以通过索引或下标操作数组中的某个数据。
操作: 查看,添加,修改,删除 说到操作,你就是要想到增删改查(CRUD)
1.2 创建一个数组:
1)通过字面量的形式创建数组
var arr = [1,"a",123,true,und,888]; // []表示一个数组 arr是变量
在[]中就可以写一堆的数据。
2)通过构建器(当成java中的类)来创建一个数组
JS内部帮我们提供了一个构造函数,也叫类 Array
// arr是对象 放到JS高级中讲
var arr = new Array(); // Array是类 new一个类,就得到一个对象
<script>
// 创建数组时,直接添加数据:
// 1)如果是字面量的形式创建,数据直接写在[]中,数据和数据之间使用逗号隔开。
// 2)如果使用new 类的形式创建,在new时,可以给Array中传递数据。
// 在Array中写多个数据。
// 1)通过字面量的形式创建数组
// 1这个数据的下标是 0
// "a"这个数据的下标是 1
// 2这个数据的下标是 2
// .....
var arr1 = [1,"a",2,"b",true,undefined];
// 2)通过构建器(当成java中的类)来创建一个数组
// 10不是代表10这个数据,代表是这个数组中可以放10个元素(数据)
var arr = new Array(10);
// length代表数据中的长度
// arr是对象 对象中有很多属性或方法 通过打点,就可以调用这个属性或方法
// console.log(arr.length);
// a,b,c就代表数组中的三个数据
let arr2 = new Array("a","b","c")
console.log(arr2.length);
</script>
2 操作数组:
2.1 数组中有一个length属性 表示数组的一个长度。length属性可读可写。
读:获取数组的长度
写:设置数组的长度
当我们设置的比本身长度小,那么就相当于删除
当我们设置的比本身长度大,那么多出来的就是空补齐
2.2 数组索引操作
默认情况下,数组中的每一个元素都索引,从0开始,依次+1。最后一个元素的索引是lenght-1。
索引也是一个可读可写的属性:
读:读取的是指定索引位置的数据
=> 如果数组确实有这个索引,那么就是这个位置的数据
=> 如果数组没有这个索引位置,那么就是und
写:设置指定索引位置的数据
=> 如果有这个索引位置,那么就给这个索引位置重新设置数据
=> 如果这个索引位置不存在,那么就是添加一个新数据
2.3 数组的遍历
所谓的遍历就是指把数据中的每一个元素都取出来的。
使用for循环进行遍历,除了for循环,还有其它方案,后面说。
2.4 数据中其它的操作(一堆方法)
push()
=> 语法:数组.push(数据1,数据2,数据3...)
=> 作用:把新的数据,追加到数组的末尾位置
=> 返回值:新数组的长度
=> 影响原数组
pop()
=> 语法:数组.pop()
=> 作用:删除数组中最后一个数据
=> 返回值:被删除的数据
=> 影响原数组
unshift()
=> 语法:数组.unshift(数据1,数据2,数据3...)
=> 作用:把新的数据,插入到数组的前面位置
=> 返回值:新数组的长度
=> 影响原数组
shift()
=> 语法:数组.shift()
=> 作用:删除数组中第一个数据
=> 返回值:被删除的数据
=> 影响原数组
reverse()
=> 语法:数组.reverse()
=> 作用:方法将数组中元素的位置颠倒,并返回该数组。数组的第一个元素会变成最后一个,数组的最后一个元素变成第一个
=> 返回值:返回该数组
=> 影响原数组
sort()
=> 语法:数组.sort()
=> 作用:对数组的元素进行排序,并返回数组。
=> 返回值:返回数组
=> 影响原数组
splice()
=> 语法:数组.splice(开始索引,多少个)
=> 作用:删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。
=> 1)截取数组 2)替换新内容
=> 截取: 数组.splice(开始索引,多少个) 如果第2个参数不写,默认就截取到最后
=> 替换新内容: 数组.splice(开始索引,多少个,替换数据1,替换数据2....)
=> 把替换数据按照顺序插入到你截取的位置
=> 返回值:返回一个数组
=> 影响原数组
concat();
=> 语法:数组.concat(数组1,数组2...)
=> 作用:合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。
=> 不会影响原数组
二、字符串
1 字符串创建
1.1 通过字面量的形式创建字符串 用的比较多
var str = "hello" 使用双引号包起来
var str = 'hello' 使用单引号包起来
1.2 new 一个类创建一个字符串
var str = new String("hello");
区别:
在控制器打印时有区域,使用起来没什么区别
2 字符串本身也是对象:
str.length 获取字符串中共多少个字符
3 字符串的操作:
空格也是一个字符
length是只读,只能获取,不能设置
字符串也是有索引的,索引也是从0开始,可以通过索引来获取某个字符,但是不能设置
字符串也可以遍历(取出字符串每一个字符)
<script>
var str = "hello world~";
console.log(str);
// 通过某个索引来获取某个字符
// console.log(str[0]);
// console.log(str[6]);
for(var i=0; i<str.length; i++){
console.log(str[i]);
}
</script>
4 模板字符串
模板字符串:
使用的是反引号:`` 可以把一个字符串放到一个反引号中。
ES6中的语法。 ES6也叫ES2015
<script>
var name = "wangcai";
var age = 20;
// name+"今年"+age 叫字符串拼接
var str = name+"今年"+age; // "name 今年 age "
console.log(str);
</script>
<script>
var name = `xiaoqiang`; // `xiaoqiang`也表示一个字符串
var age = 110;
// 在``中可以写${} {}中可以写变量
var str = `${name}今年${age}`; // `${name}今年${age}`也是字符串
console.log(str);
var str2 = `${ 110 * 2 }~~~~~~~~~~~`;
console.log(str2);
</script>
5 字符串中的方法
<script>
// charAt:从一个字符串中返回指定的字符
var str = "hello world~";
let res = str.charAt(3)
console.log(res);
// charCodeAt:方法返回 0 到 65535 之间的整数,表示给定索引处的 UTF-16 代码单元
var str = "hello world~";
var str = "中国"
let res = str.charCodeAt(0);
console.log(res);
// substr:方法返回一个字符串中从指定位置开始到指定字符数的字符
var str = "hello world~";
console.log(str.substr(1,2));
// substring: 方法返回一个字符串在开始索引到结束索引之间的一个子集
var str = "hello world~";
包前不包后
console.log(str.substring(2,4));
var str = "hello word";
console.log(str.toUpperCase());
var str2 = "AAABBB";
console.log(str2.toLowerCase());
</script>
6 练习字符串
<script>
// 关键字隐藏
// fsadfasMMdrwqlkMMjfsavnasrnMMvasdfMMsdrwe
// 需求是把MM替换成 **
let str = "fsadfasMMdrwqlkMMjfsavnasrnMMvasdfMMsdrwe";
while( str.indexOf("MM") !== -1 ){//: indexOf()返回某个指定字符在字符串中首次出现处的索引,如果此字符串中没有这样的字符,则返回 -1。
str = str.replace("MM","**")
}
// console.log(str);
let str = "fsadfasMMdrwqlkMMjfsavnasrnMMvasdfMMsdrwe";
// split 把一个字符串转成数组
// join 把一个数组转成字符串
console.log(str.split("MM").join("**"));
</script>
split() 方法用于把一个字符串分割成字符串数组。
如果您希望把单词分割为字母,或者把字符串分割为字符,可使用下面的代码:
"hello".split("") //可返回 ["h", "e", "l", "l", "o"]
若只需要返回一部分字符,请使用 howmany 参数:
"hello".split("", 3) //可返回 ["h", "e", "l"]
join() 方法用于把数组中的所有元素放入一个字符串。
arr.join("*")
返回一个字符串。该字符串是通过把 arr的每个元素转换为字符串,然后把这些字符串连接起来,在两个元素之间插入* 字符串而生成的。
三、对象
1 类和对象:
类是对对象的抽象。
对象是一个具体的事物。
var obj = {
name:"wc",
age:100
}
2 对象数据类型:
创建一个对象也有两种方式:
1)字面量创建 var obj = {} 一个{}在JS中就表示一个对象
2)new Object也可以创建 var obj = new Object(); Object在构造器,在其它语言叫类
<script>
// 字面量创建 用的比较多
// 在JS中,对象是属性的无序集合
// 集合:容器 放大量的数据
// 无序:属性是无序
var obj1 = {
name:"wc", // name:"wc"叫属性 name叫属性名 "wc"叫属性值 键值对
age:100,
score:88,
address:"bj"
}
// .属性访问运算符
// 就是用来访问一个对象上面的属性的 str.length arr.push
console.log(obj1.name);
// new Object也可以创建
// var obj2 = new Object()
</script>
3 对象的操作
点语法: .叫属性访问运算符 用的最多的
增: 对象名.属性名 = 属性值
删: delete 对象名.属性名 delete是用来删除一个对象中的属性的 deltet是运算符
改: 对象名.属性名 = 新的属性值
查: 对象名.属性名 如果去获取一个属性,但是这个属性没有,得到undefined
[]语法: 看到[],先想到数组,但是在对象中也可以使用[]
增: 对象名["属性名"] = 属性值
删: delete 对象名["属性名"]
改: 对象名["属性名"] = 新的属性值
查: 对象名["属性名"]
<script>
var obj = { name: "wc", age: 100 }
console.log(obj.name);
console.log(obj["name"]);
// a是一个变量 变量的值是一个字符串
var a = "name";
// 要求,需要通过a访问对象中的属性
console.log(obj.a); // 表示访问obj对象中的a属性(输出undefined访问失败)
console.log(obj[a]);//访问成功
// 两种方式的区别
</script>
如果对象的键存储在一个变量中,要通过这个变量去访问属性,此时只能使用[]语法, 不能使用.语法
键值,键就是属性名,值就是内容。
<script>
// 对象的遍历
var oo = new Object();//创建对象
var oo = {};//创建对象
oo.name = "康";//增
oo["sex"] = "男";//增
delete oo.name;//删
delete oo["sex"];//删
oo.name = "孔";//改
oo["sex"] = "女";//改
console.log(oo.name);//查(表示访问oo对象中的name属性)
console.log(oo["sex"]);//查
console.log(oo);
var obj = { name: "wc", age: 100, score: 88, address: "bj" }
// obj中没有length
// console.log(obj.length);
// 不能使用for循环遍历对象
// 在JS中可以使用for in对对象进行遍历
console.log(obj);
for (var key in obj) {
console.log(key, obj[key]);//key是属性名;obj[key]是key对应的值
}
</script>
4 对象练习题
判断字符串str内字符频率,并把最多的输出,如果一样多,都要找出来
<script>
// 判断字符串str内字符频率,并把最多的输出,如果一样多,都要找出来
var str = "aaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbcccccccccccccccccdsfasdf";
let obj = {}; // 空对象
for(var i=0; i<str.length; i++){
var s = str[i];
if(obj[s]){//如果属性名(重复)新增
obj[s]++;//属性值加1
}else{
obj[s] = 1; // {b:1,e:1,f:1,a:1,s:1,d:1}(属性名:属性值)
}
}
console.log(obj);//
var max = 0;
var char = "";//创建字符串
for (var key in obj) {//for in对对象进行遍历
if(obj[key] === max){
char += " "+key//这里加的每一个key是循环判定和max相同的值的属性名;(是下次循环相等的值)
}
if(obj[key] > max){
max = obj[key];//给max赋值最大的对象
char = key;
}
}
console.log(char,max);
</script>