JS对象和数组

一  JS对象

     在JS中一切事物都是对象,字符串,数值,数组,函数

     对象中包含属性和方法

对象的属性既可以存放基本数据类型也可以存放其他对象的引用值或者函数的引用值,如果存储的是函数的的引用值则该属性称为方法

  对象的创建方法:

   1 使用new关键字来创建

    var people=new Object();
    people.name="小明";
    people.age=12;
    people.eat=function(){
        alert(this.name+"年龄"+this.age+"喜欢吃冰激凌")
    }
    people.eat()

结果:

    

   2  使用键值对的形式

    var people={
        name:"小明",
        age:20,
        eat:function(){
            alert(this.name+"年龄"+this.age+"喜欢吃西瓜")
        }
    }
    people.eat()
结果:

  3 第三种创建方式

var people={};
            people.name='宋江';
            people.age=40;
            people.eat=function(){
                alert(this.name+"年龄"+this.age+"喜欢吃饺子")
            }
//结果:宋江喜欢吃饺子

补充

  • 可以用点符号访问对象属性值也可以通过数组的方式,即用["属性名称"];
  • 可以使用delete运算符删除对象的属性

二   数组

数组的创建方法

  • new关键字创建空数组
  • new关键字创建包含元素的数组
  • new关键字创建指定元素个数的数组
  • 也可以使用[]直接创建数组
  • 可以使用length属性获取数组的长度;并且可以给一个数组赋值。
        var arr1=new Array();
        var arr2=new Array('苹果','葡萄','香蕉','桔子');
        var arr3=new Array(4);
        alert(arr1); //结果:空
        alert(arr2); //结果为苹果,葡萄,香蕉,桔子
        alert(arr3)  //结果为,,,,

        var arr4=[];
        var arr5=["水果","主食"];
        alert(arr4);  //结果:空
        alert(arr5);  //结果 水果,主食
        alert(arr5.length)  //结果  2

数组元素的基本操作

  1. 读取数据:可以使用索引查询获取数组元素和添加数组元素
  2. 添加数据:使用push方法将新元素添加到数组尾部.
  3. 删除数据:可以使用delete运算符删除指定的元素。
  4. 删除末尾元素(更新数据)pop()方法:该方法会返回删除的元素。
  5. 删除顶端的元素 shift方法:
  6. 在数组顶端添加元素 unshift方法:返回值为新数组的长度,但不建议使用,IE会出错。
        var arr1=new Array();
        var arr2=new Array('苹果','葡萄','香蕉','桔子');
        alert(arr2[1])//  结果:葡萄
        arr2.push("西瓜");//在队尾添加
        alert(arr2);//结果:苹果,葡萄,香蕉,桔子,西瓜
        delete arr2[2];//删除指定元素
        alert(arr2)//结果:苹果,葡萄,桔子,西瓜
        arr2.pop()//删除队尾元素
        alert(arr2)//苹果,葡萄,桔子
//unshift 在顶端添加元素
//shift   在顶端删除元素(很简单,记住就行,不一一举例)
  1. 字符转换:toString方法将数组表示为字符串,该方法从Object继承而来。
  2. join方法输出数组元素。(输出结果会转换成字符串)
        var arr2=new Array('苹果','葡萄','香蕉','桔子');
        var str=arr2.toString();
        alert(typeof(str))
//结果

  1. 数组逆序reverse:颠倒数组元素的顺序;返回值为逆序后的新数组。
  2. 数组排序 sort:
    • 语法 数组名.sort(sortfunction)
    • sortfunction若省略,默认为从按照ASII字符顺序进行升序排列
    • sortfunction必须返回:正值、零、负值三者之一。正值表示第一个值大于第二个值,负值反之,零则相等。
  3. 扩充数组 concat:将多个数组的元素合并为一个新的数组。
     arrayObject.concat(arrayX,arrayX,......,arrayX)
       arrayX为必选参数
//reverse代码 
   <script>
        var fruit=new Array('苹果','葡萄','香蕉','桔子','桃子','石榴');
        document.write(fruit+'</br>')
        fruit.reverse()
        document.write(fruit+'</br>')
    </script>

//sort代码
        var fruit=[7,10,32,6,9,4]
        document.write(fruit+'</br>')
        fruit.sort(sortFun)
        document.write(fruit+'</br>')
        function sortFun(ar1,ar2){
            if(ar1>ar2){
                return -1;//返回-1表示逆序,如果返回1,表示正序
            }else if(ar1<ar2){
                return 1;
            }else{
                return 0;
            }
        }


//concat代码

        var fruit1=new Array('5个苹果','3斤葡萄','4个香蕉');
        var fruit2=new Array('6个桔子','2个桃子','1个石榴');
        document.write('合并前的两个数组:'+'</br>')
        document.write(fruit1+'</br>')
        document.write(fruit2+'</br>')
        //var fruit=fruit1.concat(fruit2)
        var fruit=fruit1.concat('1个石榴')
        document.write('合并后的新数组:'+'</br>')
        document.write(fruit+'</br>')
  1. splice方法:删除、替换、插入元素
    • 会更改原数组
    • 第一参数为起始位置索引
    • 第二参数为切取元素个数
    • 第三个参数为插入元素,可选项
    • 若传入参数个数等于第二个参数,则为替换,如传入参数小于索引个数则为删除
    • 若传入参数个数大于第二个参数,则删除再插入
var arr=new Array('元素0','元素1','元素2','元素3','元素4','元素5');
        document.write(arr+'</br>')
        var arr1=arr.splice(1,2,'元素A','元素B')
        document.write(arr+'</br>')
        document.write(typeof arr1+'</br>')
  1. 切取数组的一段元素 slice:
    1. 切取部分作为新数组返回,不会对原数组改变。
    2. 第一参数为起始位置索引
    3. 第二参数为结束位置索引,不包括第二个参数 ,注意区分splice
    4. 若省略第二个参数则直接切取到结尾
    <script>
        var arr=new Array('元素0','元素1','元素2','元素3','元素4','元素5','元素6');
        document.write(arr+'</br>')
        var arr1=arr.slice(1,4)
        document.write(arr+'</br>')
        document.write(arr1+'</br>')
    </script>

附一个圣诞树代码

    <script>
        //     *
        //    ***
        //   *****
        //  *******
        // *********
     //   ***********
        var h=30;
        for(var i=1;i<=h-1;i++){
            for(var j=h;j>=i;j--){
                document.write("&nbsp;")
            }
            for(var n=1;n<=2*i-1;n++){
                    document.write("<span style='color: green'>*</span>")
            }
            document.write('<br>')
        }
        var h=30;
        for(var i=1;i<=h-1;i++){
            for(var j=h;j>=i;j--){
                document.write("&nbsp;")
            }
            for(var n=1;n<=2*i-1;n++){
                    document.write("<span style='color: green'>*</span>")
            }
            document.write('<br>')
        }
            var h=30;
        for(var i=1;i<=h-1;i++){
            for(var j=15;j>=0;j--){
                document.write("&nbsp;")
            }
            for(var n=1;n<=h;n++){
                    document.write("<span style='color: green'>*</span>")
            }
            document.write('<br>')
        }
    </script>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏程序员互动联盟

【面试宝典】continue、break和return

面试官:continue会用吧。 小白:用来结束当前循环的。 面试官:那break呢? 小白:也是用来结束循环的。 面试官:那么它们的区别呢? 面试解析: 面试...

3588
来自专栏一个会写诗的程序员的博客

第5章 函数与函数式编程第5章 函数与函数式编程

函数式编程语言最重要的基础是λ演算(lambda calculus),而且λ演算的函数可以传入函数参数,也可以返回一个函数。函数式编程 (简称FP) 是一种编程...

611
来自专栏司想君

JavaScript闭包,只学这篇就会了

昨天发的文章,排版出现了重大失误。让大家的眼睛受累了。今天再发一遍。 这篇文章使用一些简单的代码例子来解释JavaScript闭包的概念,即使新手也可以轻松参透...

2778
来自专栏黑泽君的专栏

java基础学习_面向对象(下)02_day09总结

============================================================================= ==...

842
来自专栏Python研发

一起来学Go --- (go的变量)

变量是几乎所有编程语言中最基本的组成元素,从根本上说,变量相当于是一块数据存储空间的命名,程序可以通过定义一个变量来申请一块数据存储空间,之后可以通过引用变量名...

1093
来自专栏carven

js原生函数之call和apply,bind

call 和 apply 和 bind 都是为了改变某个函数运行时的 context 即上下文而存在的,换句话说,就是为了改变函数体内部 this 的指向。

900
来自专栏ShaoYL

C语言基础-循环结构

3549
来自专栏数据之美

浅谈 Scala 中下划线的用途

Scala 作为一门函数式编程语言,对习惯了指令式编程语言的同学来说,会不大习惯,这里除了思维方式之外,还有语法层面的,比如 underscore(下划线)就会...

19310
来自专栏轮子工厂

让我第3不开心的事是:同样是程序员,你竟然选择了偷懒~

好几个人在后台催更C语言教程,其实我也很委屈鸭,呆博去浪去了,然后他就义正言辞的和我说不想排版推文,一听就是想要偷懒的借口,口亨~

1013
来自专栏cs

java的几个不错习题

现在定义如下的一个数组:intoldArr[]={1,3,4,5,0,0,6,6,0,5,4,7,6,7,0,5},要求将以上数组中值为0的去掉,将不为0的值存...

792

扫码关注云+社区

领取腾讯云代金券