JavaScript知識整理（5）

JavaScript

• • 構造函數
  • 周遊對象
  • 回顧練習
  • 内置對象
  • • 三個取整方法
    • 随機數
    • 日期對象

來源部落格：【Harryの心閣】

• 構造函數，周遊對象，内置對象

構造函數

1. 将對象裡面相同的屬性和方法抽象出來封裝到函數裡面
2. 構造函數首字母要大寫
3. 構造函數必須使用new，隻要調用new就建立了一個對象

function Star(uname) {
        this.name = uname;
        this.sing = function(sang){
            console.log(sang);
        }
    }
    var ldh = new Star('ldh')
    console.log(typeof ldh);
    console.log(ldh.name);
    ldh.sing('你好') 
           

周遊對象

1. for..in

   格式

   for(變量in 對象){}

var momo = {
        age: 18,
        name: '你好'
    }
    for (var k in momo) { /*k變量 輸出得到的是屬性名*/
        console.log(k);
        console.log(momo[k]);
    }
           

1. 建立一個電腦對象,有顔色,有重量,有品牌,有型号,可以看電影,可以聽音樂,可以打遊戲,可以敲代碼

• 使用系統自帶的構造函數建立對象

// 建立對象
var computer = new Object();
// 為對象添加屬性
    computer.color = '灰色';
    computer.weight = '2kg';
    computer.brand = 'lenovo';
    computer.type = 'xiaoxin';
// 為對象添加方法
    computer.movie = function(){
        console.log('看電影');
    }
    computer.music = function(){
        console.log('聽音樂');
    }
    computer.play = function(){
        console.log('玩遊戲');
    }
    computer.Kcode = function(){
        console.log('敲代碼');
    }
//調用對象屬性
    console.log('我的顔色是'+computer.color );
    console.log('我的重量是'+computer.weight);
    console.log('我的品牌是'+computer.brand);
    console.log('我的類型是'+computer.type);
//調用對象方法
    computer.movie();
    computer.music();
    computer.play();
    computer.Kcode();
           

• 自定義構造函數建立對象

function Computer(color, weight, brand, type) {
        this.color = color;
        this.weight = weight;
        this.brand = brand;
        this.type = type;
        var re = ('這台' + this.color + ',重量為' + this.weight + '的' + this.type)
        this.movie = function () {
            console.log(re + '可以看電影');
        },
            this.game = function () {
                console.log(re+ '可以打遊戲');
            },
            this.Kcode = function () {
                console.log(re+ '可以敲代碼');
            }
    }
    var com = new Computer('灰色', '2kg', 'lenovo', '小新');
    com.movie();
    com.game();
    com.Kcode();

           

• 使用字面量形式建立對象

var computer2 = {
        color: '灰色',
        weight: '2kg',
        brand: 'lenovo',
        type: '小新',
        movie: function () {
            console.log('這台' + this.color + ',重量為' + this.weight + '的' + this.type + '電腦可以看電影');
        },
        game: function () {
            console.log('這台' + this.color + ',重量為' + this.weight + '的' + this.type + '可以打遊戲');
        },
        write: function () {
            console.log('這台' + this.color + ',重量為' + this.weight + '的' + this.type + '可以敲代碼');
        }
    }
    // 使用for..in便利對象和方法
    for (var k in computer2) {
        console.log(computer2[k]);
    }
    // 調用方法
    computer2.movie();
    computer2.game();
    computer2.write();
           

回顧練習

1. 寫一個函數,實作反轉任意數組。

function reverse(arr){
    var newArr = [];
    for(var i = arr.length - 1; i >= 0; i--){
        newArr[newArr.length] = arr[i];
    }
    return newArr;
}
var arr1 = reverse([1,2,31,412,3124])
console.log(arr1)
/*如果使用arguments的話後面的指派不需要加`[]`*/
           

{% endfolding %}

1. 寫一個函數,實作對數組的排序。

function sort(num){
        for(var i = 0; i<=num.length -1; i++){
            for(var j=0;j<=num.length -i-1;j++){
                if(num[j]>num[j+1]){
                var temp = num[j];
                num[j] = num[j+1];
                num[j+1]=temp;
                }
            }
        }
        return num;
    }
     var num1 = new sort([1,32141,212,23,12,21])
     console.log(num1);
           

内置對象

1. Math,Date,Array,String
2. 數學屬性 【屬性位址】
3. 不是構造函數，直接使用
4. 絕對值

   Math.abs()

三個取整方法

1. Math.floor()向下取整
2. Math.ceil()向上取整
3. Math.round()四舍五入

随機數

1. Math.random()
2. 随機點名

function getRandom(min, max) {
        return Math.floor(Math.random() * (max - min)) + min;
    }
    var arr = ['dasd', 'dasxaw', 'dasaxfa', '正讀', '真弟弟'];
    console.log(arr[getRandom(0, arr.length - 1)]);
           

1. 猜數字遊戲

function getRandom(min, max) {
        return Math.floor(Math.random() * (max - min)) + min;
    }
    var random = getRandom(1, 50);
    while (true) {
        for (var i = 1; i <= 10; i++) {
            var num = prompt('你來猜，請輸入一個1-50的數字');
            if (num > random) {
                alert('提示：您猜大了！！' + '\n' + '您還有' + (10 - i) + '次機會');
            } else if (num < random) {
                alert('提示：你猜小了！！' + '\n' + '您還有' + (10 - i) + '次機會')
            } else if (num == random) {
                alert('恭喜你猜對了');
                break;
            }
        } break;
    }
           

日期對象

1. 日期對象是一個構造函數

   var date = new Date()

   ;
2. 數字寫法

   ,

   字元串寫法

   2021-1-1 0:0:0

var date = new Date();
console.log(date);
console.log(date.getFullYear());
console.log(date.getMonth() + 1);
console.log(date.getDate());
console.log(date.getDay());