js進(jìn)階（二）

第十二天

04-基礎(chǔ)進(jìn)階-第02天{對象進(jìn)階、內(nèi)置對象}

對象

工廠模式創(chuàng)建對象

  • 工廠模式:即在函數(shù)中創(chuàng)建對象時,所有屬性使用參數(shù)傳遞進(jìn)來

  • 工廠模式創(chuàng)建出來的對象使用typeof打印出來的全是object

    function Student(name,age,sex,score){
    var stu = new Object();
    stu.name = name;
    stu.age = age;
    stu.sex = sex;
    stu.score = score;
    stu.sayHi = function(){
        console.log("我叫"+this.name+"今年"+this.age+"歲");
    }
    return stu;
}

var stu1 = new Student("zs",18,1,100);
var stu2 = new Student("ls",20,2,99);
var stu3 = new Student("ww",22,1,80);

console.log(typeof stu1);// object
console.log(typeof stu2);// object
console.log(typeof stu3);// object
console.log(stu1 instanceof Student); // false
console.log(stu2 instanceof Student); // false
console.log(stu3 instanceof Student); // false

構(gòu)造函數(shù)模式創(chuàng)建對象

  • 原理:使用this關(guān)鍵字改變對象歸屬

    function Student(name,age,sex,score){
    this.name = name;
    this.age = age;
    this.sex = sex;
    this.score = score;
    this.sayHi = function(){
        console.log("我叫"+this.name+"今年"+this.age+"歲");
    }
}

var stu1 = new Student("zs",18,1,100);
console.log(typeof stu1); // object
console.log(stu1 instanceof Student); // true

原型模式創(chuàng)建對象

原型屬性

  • prototype:是構(gòu)造函數(shù)的原型屬性。將屬性或方法綁定到構(gòu)造函數(shù)的prototype上后,將來通過構(gòu)造函數(shù)創(chuàng)建的對象都有這個屬性或方法

    function Student(name,age,sex,score){
    this.name = name;
    this.age = age;
    this.sex = sex;
    this.score = score;
}
Student.prototype.sayHi = function(){
    console.log("我叫"+this.name+"今年"+this.age+"歲");
}

var stu1 = new Student("zs",18,1,100);
var stu2 = new Student("zs",18,1,100);
console.log(stu1.sayHi === stu2.sayHi);// true

  • 使用:一般通過原型屬性綁定公共的方法和屬性

  • __proto__:是對象的原型屬性。

  • 對象的原型屬性__proto__指向構(gòu)造函數(shù)的原型屬性prototype

    console.log(stu1.__proto__ === Student.prototype); // true

值類型&引用類型

  • 值類型:值類型其實就是基本數(shù)據(jù)類型,在內(nèi)存中直接存儲值

    string number boolean undefined null

  • 引用類型:引用類型其實就是復(fù)雜數(shù)據(jù)類型,在內(nèi)存中存儲引用,主要就是Object

值類型作參數(shù)

  • 值類型作參數(shù)不會改變原始數(shù)據(jù)

    function fn(a,b){
    a = a+1;
    b = b+1;
    console.log(a); // 2
    console.log(b); // 3
}
var x = 1;
var y = 2;
fn(x,y);
console.log(x); // 1
console.log(y); // 2

引用類型作參數(shù)

  • 引用類型作參數(shù)因為拷貝的是棧中的地址,而地址指向堆中的同一個空間,所以會改變堆中的數(shù)據(jù)

    function Person(name,age){
    this.name = name;
    this.age = age;
}
function f2(p){
    p.name = "ww";
    console.log(p.name);// ww
}
var p2 = new Person("zs",18);
f2(p2);
console.log(p2.name); // ww

數(shù)組

復(fù)制數(shù)組

// 深層復(fù)制
function deepClone(arr){
    var newArr = [];
    for(var i =0;i<arr.length;i++){
        newArr[newArr.length] = arr[i];
    }
    return newArr;
}

var arr1 = [1,2,3];
var arr2 = deepClone(arr1);
arr2[0] = 100;
console.log(arr1);// [1,2,3] 不影響原始數(shù)組
console.log(arr2);// [100,2,3]

增刪

var arr = [1,2,3];
arr.push(0); // 從后面加入 [1,2,3,0] 返回新數(shù)組的長度
arr.unshift(0);// 從前面添加 [0,1,2,3] 返回新數(shù)組的長度
arr.pop();// 從后面刪除 [1,2] 返回刪除的元素
arr.shift();// 從前面刪除 [2,3] 返回刪除的元素

字符串分隔數(shù)組

// 數(shù)組join方法實現(xiàn)原理
function join(arr,sep){
    var str = arr[0];
    for(var i=0;i<arr.length;i++){
        str = str + sep + arr[i];
    }
    retrun str;
}

翻轉(zhuǎn)數(shù)組

// 數(shù)組reverse方法實現(xiàn)原理
function reverse(arr){
    for(var i=0;i<arr.length/2;i++){
        var temp = arr[i];
        arr[i] = arr[arr.length-1-i];
        arr[arr.length-1-i] = temp;
    }
    return arr;
}

數(shù)組過濾filter

  • 配合回調(diào)函數(shù)使用

    var arr = [1000,2500,1500,2000,3000];
arr.filter(function(element,index,arr){
    if(element > 2000){
        return false; // 刪除元素
    }else{
        return true; // 保留元素
    }
});

數(shù)組索引indexOf

var arr = [1,2,3,1,3,2];
console.log(arr.indexOf(2));// 0 從左往右找某元素第一次出現(xiàn)的位置 返回位置索引
console.log(arr.lastIndexOf(1)); // 3 從左往右找某元素最后一次出現(xiàn)的位置 返回位置索引

獲取數(shù)組中某個元素每次出現(xiàn)的位置

var arr = ["c","a","z","a","x","a"];
var index = -1;
do{
    index = arr.indexOf("a",index + 1);
    if(index != -1){
        console.log(index);// 1 3 5 
    }
}while(index != -1);

獲取數(shù)組中每個元素出現(xiàn)的次數(shù)

var arr = ["c","a","z","a","x","a"];
var o = {};
for(var i=0;i<arr.length;i++){
    var item = arr[i];
    if(o[item]){// 能進(jìn)來說明 對象中有這個值
        o[item]++; // 每出現(xiàn)一次 加一次
    }else{
        // 說明對象中沒有 第一次出現(xiàn)
        o[item] = 1;
    }
}

截取數(shù)組

var arr = [0,1,2,3,4,5];
arr.slice(1,3);// [1,2,3] 參數(shù) [start,end) 從start開始截取到end 包括start 返回新數(shù)組

arr.splice(0,2);// [0,1] 參數(shù) start 個數(shù) 從原數(shù)組中刪除符合要求的元素 返回這些元素組成的數(shù)組

遍歷數(shù)組forEach

var arr = [1,2,3,4,5];
arr.forEach(function(element,index,array){
    console.log(element);// 1 2 3 4 5
});
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • JavaScript 定義了幾種數(shù)據(jù)類型? 哪些是原始類型?哪些是復(fù)雜類型?原始類型和復(fù)雜類型的區(qū)別是什么?六種：...
    Komolei閱讀 273評論 0贊 0
  • 工廠模式類似于現(xiàn)實生活中的工廠可以產(chǎn)生大量相似的商品，去做同樣的事情，實現(xiàn)同樣的效果;這時候需要使用工廠模式。簡單...
    舟漁行舟閱讀 8,116評論 2贊 17
  • 單例模式 適用場景：可能會在場景中使用到對象，但只有一個實例，加載時并不主動創(chuàng)建，需要時才創(chuàng)建 最常見的單例模式，...
    Obeing閱讀 2,313評論 1贊 10
  • 一、面向過程和面向?qū)ο蟮膮^(qū)別、聯(lián)系 1.面向過程編程:注重解決問題的步驟,分析問題需要的每一步,實現(xiàn)函數(shù)依次調(diào)用。...
    空谷悠閱讀 940評論 1贊 11
  • 第1章 第一個C程序第2章 C語言基礎(chǔ)第3章 變量和數(shù)據(jù)類型第4章 順序結(jié)構(gòu)程序設(shè)計第5章 條件結(jié)構(gòu)程序設(shè)計第6章...
    小獅子365閱讀 10,863評論 3贊 71

友情鏈接更多精彩內(nèi)容