0
点赞
收藏
分享

微信扫一扫

关于数组的介绍

数组

从数学角度出发,数组是经过编号的数据的有序集合,从这点来看它和对象很相似。而事实上JS中的数组本质上就是对象,是具有额外功能层的对象。数组是在对象的基础上加以改造,支持通过[]来读写对象中数字下标属性并拥有一个自动计算的length属性。

1)创建数组

    //创建一个空数组

    var arr = [ ];  

    //按编号添加元素

    arr[0] = "a";

    arr[1] = "b";

    arr[2] = "c";

    //或者在声明时直接初始化数组元素

    var arr = ["a", "b","c"];

    //在控制台可以结构化打印,便于查看数组成员

    console.log(arr);

    //如果要在页面输出则调用toString()方法

    //数组有定制的toString,相当于如下定义

    arr.toString = function () {

        return this.join(",");

    }

    document.write(arr);

    //数组的类型为object

    console.log(typeof arr);

2)使用构造器

更为显示的创建一个数组(对象),需要使用数组的构造器Array(也叫构造函数)

1.1关联数组

    数组除了使用数字编号外,还可以使用字符串来标记,这在一些语言中被称为“关联数组”。而js中关联数组被视作数组对象的属性而非数组元素,因此该部分成员既可以使用[ ],也可以使用属性的方式来读写;反之,对象的属性也可以使用数组的方式来读写,考虑如下两种数据模式,你会发现数组和对象完全是互通的,只是操作形式上的区别而已

所谓的关联数组指以字符串作为下标的元素

1.2数组长度

数组的length属性用来查看它的长度也就是元素的个数。只有编号的数组成员才被视作数组元素,而关联数组中的字符串命名数据则是对象的属性,不计入length值。

arr["foo"] = "foo";

arr["bar"] = "bar"; 这两个不计入数组长度的计算

1.3遍历数组

1)可以使用for循环数组的下标然后取数组元素,下标的范围是[0, arr.length - 1]。该方法只能打印出所有数字下标元素且要求数组元素是连续的,否则会产生undefined值。

var arr =["a", "b", "c"];

    //跳过编号3的元素

    arr[4] = "e";

    //添加关联数组成员

    arr["foo"] = "hello";

    arr["bar"] = "world";

    //循环从0到arr.length - 1之间的所有元素

    for (var i = 0; i < arr.length; i++) {

        console.log(arr[i]);

    }

1.4 for...in 语句 for...in用来查看对象或者数组的内容,它能遍历对象自身拥有的所有内容,但是对于多数继承的属性和全部的内容都无法遍历;无论如何,使用for...in都是我们调试对象和数组的一个很好的工具。使用for...in遍历对象属性,它也有2个限制

     1、遍历出来的属性的顺序 不可控

     2、不能遍历继承的属性

for (var p in o) {

console.log(p, o[p] ); 

}

定义一个变量p或者表达式接收每次从对象o中循环出来的成员,接下来通过p检索属性,属性值则可以通过o[p],而不是o.p来获取,因为在“.”运算中不能解析变量,属性只能是硬编码的字符串;

    var o = {

        name: "张三",

        age: 23,

        sing () { }

    };

    for (var p in o) {

        //在[ ]运算中能够解析变量p为一个值

        console.log(p, o [p]);

    }

        // 定义变量p 用来接收person中的属性

        // p始终代表在person对象里面的某个属性

        // for的过程 会自动循环 p值一直在更新

3)数组方法

学习内置函数方法的几个关键点:

1、记住函数名/单词

2、函数参数,有几个参数,分别代表什么含义

3、函数的最后的返回值是什么

var arr = [ 'a',  'b',  'c',  'b' ];

查询索引的方法

01、indexOf ('b')检测元素在数组的位置

console.log ( arr.indexOf ('b') )  // 数组位置的编号:输出结果为1

02、lastIndexOf ('b')元素在数组中最后出现的位置

console.log ( arr.lastIndexOf ('b') )  // 数组位置的编号:输出结果为3

检测元素

03、includes ('e')判断数组中是否存在某个元素

console.log(arr.includes ('e') );  //  false

console.log(arr.includes ('c') );  //  true

04、slice (1,3)截取数组

截取数组的一部分,它有2个参数,分别是截取起始位置和结束位置(不包含自己,需要多截取一位)它返回的是截取出来的新数组,原数组不变,其实slice就是在复制再输出出来

console.log(arr.slice (1,3) );  // ['b' , 'c']

console.log(arr);  //  ['a','b','c','b']

05、splice (1,2)删除数组元素,它返回的是删除的元素,但是元素组本身已经发生改变,因为已经删除

console.log(arr.splice (1,2) );  //  ["b", "c"]

console.log(arr);  //  ['a', 'b']

队列方法

var  arr = ['a', 'b', 'c', 'd']

06、unshift (0)在数组头部添加元素,返回操作之后的数组长度

console.log(arr.unshift (0) );  // 返回长度为5

原数组已经发生改变:console.log(arr);  //  [0, 'a', 'b', 'c', 'd'];

07、shift()在头部删除元素,返回被删除的元素

console.log(arr.shift() ); 0

在头部删除后,数组已经发生改变:console.log(arr)  // ['a', 'b', 'c', 'd'];

08、push('e')尾部添加一个元素 返回操作之后的数组长度

console.log(arr.push('e') );  //  5

操作后的数组:console.log(arr);  ['a', 'b', 'c', 'd', 'e'];

09、pop()尾部删除一个元素 返回被删除的元素

console.los(arr.pop() );  // e

操作之后的数组:console.log(arr); //  ['a', 'b', 'c', 'd']

其他常用的方法

var  arr  =  [1,2,3,4,5]; 

10、join('<')将数组元素拼接成字符串

console.log(arr.join('<') );  //  1<2<3<4<5

11、concat(arr2)合并数组

var  arr2 = [6,7,8,9,10];

console.log(arr.concat(arr2) );  // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

4)字符串方法

创建字符串-数组类型

var  str  =  "hello world";  //  字面量

创建字符串-对象类型

var  str  =  new  string  ("hello world");  //  构造器

打印输出是一个对象类型:console.dir(str);

1、length查看字符串长度

console.log(str.length);  //  输出长度为11

2、str[1]通过编号取字符串

console.log(str[1] );  //  输出为e

3、charAt(1)查找1位置的子字符

console.log(str.charAt(1) );  //  输出为e

4、indexOf("o")由值找索引(下标)

console.log(str.indexOf("o") );  //  输出为4  o开始出现的位置

5、lastIndexOf("o")由值找索引(下标)

console.log(str.lastIndexOf("o") );  //  输出为7 o最后出现的位置

6、slice (num,num)字符串截取,不包括结束位置,有两个参数,如果不传入第二个参数,则表示截取到末尾

console.log(str.slice (6,11));  //  输出为world

7、substr(num,num)字符串截取,有两个参数,第一个参数表示开始的位置,第二个参数表示截取多少个字符串

console.log(str.substr(6, 5)); // 输出为world  截取了5个字符串

8、includes("文本")字符串检测,检查是否包含某个字符串的内容

console.log(gname.includes("伊利"));  //  输出为true,一般使用if判断的方法检测输出内容

9、startsWith("文本")检测字符串开头

        if (name.startsWith("文本")) {

            console.log("id选择器");

        } 

10、endsWith(".")检测字符串结尾

      if (cont.endsWith(".")) {

            console.log("一句完整的话")

        } else {

            console.log("没有结束的话");

        }

11、大小写转化,比较的要求是不区分大小写,所以需要统一转化

        toLowerCase转化为小写,toUpperCase()转化为大写

            var code = "Xi2d"; // 系统生成的验证码

            var user = "xI2d"; // 用户输入的验证码

        // 比较的要求是不区分大小写,所以需要统一转化

            if (code.toLowerCase() == user.toLowerCase()) { // 将两个变量转换成小写

                console.log("输入正确");

            } else {

            console.log("输入不正确");

            }

11、去除头尾的空白字符

    var nickname = "  冷光~秋月";

     console.log(nickname.length);  // 这个字符串长度输出为7

    var a = nickname.trim()

    console.log(a) //  这个字符串长度输出为5

举报

相关推荐

0 条评论