js進階(二)

第十二天

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

對象

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

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

  • 工廠模式創(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
    
    
  • 引用類型:引用類型其實就是復雜數(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ù)組

復制數(shù)組

// 深層復制
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]){// 能進來說明 對象中有這個值
        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)系作者
  • 序言:七十年代末抑淫,一起剝皮案震驚了整個濱河市拿霉,隨后出現(xiàn)的幾起案子软能,更是在濱河造成了極大的恐慌,老刑警劉巖硝烂,帶你破解...
    沈念sama閱讀 210,978評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異铜幽,居然都是意外死亡滞谢,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,954評論 2 384
  • 文/潘曉璐 我一進店門除抛,熙熙樓的掌柜王于貴愁眉苦臉地迎上來狮杨,“玉大人,你說我怎么就攤上這事到忽¢辖蹋” “怎么了?”我有些...
    開封第一講書人閱讀 156,623評論 0 345
  • 文/不壞的土叔 我叫張陵喘漏,是天一觀的道長护蝶。 經(jīng)常有香客問我,道長翩迈,這世上最難降的妖魔是什么持灰? 我笑而不...
    開封第一講書人閱讀 56,324評論 1 282
  • 正文 為了忘掉前任,我火速辦了婚禮帽馋,結(jié)果婚禮上搅方,老公的妹妹穿的比我還像新娘。我一直安慰自己绽族,他們只是感情好姨涡,可當我...
    茶點故事閱讀 65,390評論 5 384
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著吧慢,像睡著了一般涛漂。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上检诗,一...
    開封第一講書人閱讀 49,741評論 1 289
  • 那天匈仗,我揣著相機與錄音,去河邊找鬼逢慌。 笑死悠轩,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的攻泼。 我是一名探鬼主播火架,決...
    沈念sama閱讀 38,892評論 3 405
  • 文/蒼蘭香墨 我猛地睜開眼鉴象,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了何鸡?” 一聲冷哼從身側(cè)響起纺弊,我...
    開封第一講書人閱讀 37,655評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎骡男,沒想到半個月后淆游,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,104評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡隔盛,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,451評論 2 325
  • 正文 我和宋清朗相戀三年犹菱,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片吮炕。...
    茶點故事閱讀 38,569評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡已亥,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出来屠,到底是詐尸還是另有隱情,我是刑警寧澤震鹉,帶...
    沈念sama閱讀 34,254評論 4 328
  • 正文 年R本政府宣布俱笛,位于F島的核電站,受9級特大地震影響传趾,放射性物質(zhì)發(fā)生泄漏迎膜。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 39,834評論 3 312
  • 文/蒙蒙 一浆兰、第九天 我趴在偏房一處隱蔽的房頂上張望磕仅。 院中可真熱鬧,春花似錦簸呈、人聲如沸榕订。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,725評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽劫恒。三九已至,卻和暖如春轿腺,著一層夾襖步出監(jiān)牢的瞬間两嘴,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,950評論 1 264
  • 我被黑心中介騙來泰國打工族壳, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留憔辫,地道東北人。 一個月前我還...
    沈念sama閱讀 46,260評論 2 360
  • 正文 我出身青樓仿荆,卻偏偏與公主長得像贰您,于是被迫代替她去往敵國和親坏平。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 43,446評論 2 348

推薦閱讀更多精彩內(nèi)容

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