设为首页 加入收藏

TOP

JavaScript常用对象(一)
2019-09-17 18:49:29 】 浏览:64
Tags:JavaScript 常用 对象

一、创建对象

  1. 构造函数

    • 使用new操作符后跟Object构造函数
    // 创建对象
    var person = new Object();
    // 给对象添加name和age属性
    person.name = 'jack';
    person.age = 28;
    // 给对象添加fav的方法
    person.fav = function(){
        console.log('泡妹子');
    }
    
    // 特殊:
    var person = {};    // 与new Object()相同
  2. 使用对象字面量表示法

    • 对象字面量是对象定义的一种简写形式,目的在于简化创建包含大量属性的对象的过程
    var person = {
        name : 'jack';
        age : 28,
        fav : function(){
            console.log('泡妹子');
        }
    }
    • this指向
      • 对象中的this指向当前对象
      • 全局作用域中的this,一定指向window
      • 函数中的this,一般情况下,都指向window
        • 特殊情况:使用call和apply,此时this指向传入的对象
      • 自执行函数中的this,一定指向window
    var obj = {};
    obj.name = 'mjj';
    obj.fav = function(){        
        console.log(this);       // 此时this指向当前对象,即obj 
    }
    
    console.log(this);           // 此时this指向window
    function  add(x,y) {
        console.log(this.name);
    }
    add();                      // 空值,此时this指向window
    add.call(obj,1,2);           // 此时this指向传入的对象,即obj
    add.apply(obj,[1,2]);        // 此时this指向传入的对象,即obj
    
    (function () {
        console.log(this);       // 此时this指向window
    })()
  3. 访问对象中属性的方法

    • 点语法:用来访问对象中的属性
    person.name;         // jack
    person.fav();        // 泡妹子
    • 括号表示法
    person['name'];          // 相当于person.name;
  4. 遍历对象

    var obj = {};
    for (var key in obj){
        obj[key]
    }
  5. 面向对象

    // 使用构造函数来创建对象
    function Point(x, y) {
      this.x = x;
      this.y = y;
    }
    Point.prototype.toString = function () {
      return '(' + this.x + ', ' + this.y + ')';
    };
    var p = new Point(1, 2);
    
    // es6用class来创建对象
    class Person{
        constructor(name,age){
            // 初始化
            this.name = name;
            this.age = age;
        }
        fav(){
            console.log(this.name);
        }
    }
    var p = new Person('mjj',18);
    p.fav();

二、常用对象

2.1 数组:Array

  1. 数组的创建方式

    • 跟object创建对象一样,使用Array构造函数方式创建
    var colors = new Array();
    • 使用字面量方式创建数组
    var colors = [];
  2. Array.isArray():确定某个值到底是否是数组

    var colors = ['red','green','blue'];
    Array.isArray(colors);       // true
  3. toString():返回由数组中每个值以一个以逗号拼接成的字符串

    var colors = ['red','green','blue'];
    alert(colors.toString());        // red,green,blue
  4. join方法:返回由数组中每个值以相同符号拼接成的字符串

    var colors = ['red','blue','green'];
    colors.join('||');           // red||blue||green
  5. 栈方法:LIFO(后进先出)

    • push():进,可以接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度
    var colors = [];
    var count = colors.push('red','blue','green');
    alert(count);                // 3
    • pop():出,从数组末尾移除最后一项,减少数组的length值,然后返回移除的项
    var item = colors.pop();     // 取最后一项
    alert(item);                 // green
    alert(colors.length);        // 2
  6. 队列方法:FIFO(先进先出)

    • unshift():进,在数组前端添加任意个项并返回新数组的长度
    var colors = [];
    var count  = colors.unshift('red','green');  // 推入两项
    alert(count);                // 2
    console.log(colors);         // ["red", "green"]
    • shift():出,移除数组中的第一个项并返回该项,同时将数组长度减1
    var colors = ['red','blue','green'];
    var item = colors.shift();       // 取得第一项
    alert(item);                 // "red"
    alert(colors.length);        // 2
  7. 重排序方法

    • reverse():反转,翻转数组项的顺序
    var values = [1,2,3,4,5];
    values.reverse();
    alert(values);           // 5,4,3,2,1
    • sort():排序,默认是升序排列
    // 升序
    function compare(v1,v2){
        if(v1 < v2){
            return -1;
        }else if (v1 > v2){
            return 1;
        }else{
            return 0;
        }
    }
    var values = [0,1,5,10,15];
    values.sort(compare);
    alert(values);           // 0,1,5,10,15
    // 降序
    function compare(v1,v2){
        if(v1 < v2){
            return 1;
        }else if (v1 > v2){
            return -1;
        }else{
            return 0;
        }
    }
    var values = [0, 1, 5, 10, 15];
    values.sort(compare);
    alert(values);           // 15,10,5,1,0
  8. 操作方法

    • concat():数组合并方法,一个数组调用concat()方法去合并另一个数组,返回一个新的数组,接收的参数是可以是任意的
      • 参数为一个或多个数组,会将这些数组中每一项都添加到结果数组中。
      • 参数不是数组,这些值就会被简单地添加到结果数组的末尾
    var colors = ['red','blue','green'];
    colors.concat('yello');                   // ["red", "blue", "green", "yello"]
    colors.c
首页 上一页 1 2 3 4 下一页 尾页 1/4/4
】【打印繁体】【投稿】【收藏】 【推荐】【举报】【评论】 【关闭】 【返回顶部
上一篇二、VUE项目BaseCms系列文章:项.. 下一篇创建Npm脚手架

最新文章

热门文章

Hot 文章

Python

C 语言

C++基础

大数据基础

linux编程基础

C/C++面试题目