【JavaScript 变数】Delete 删除变数释放记忆体

Photo by Mohammad Rahmani on Unsplash

delete 功能

删除指定的属性变数，当删除后，Garbage Collection 会自动回收这个没有在使用的记忆体

成功删除的时候会回传 true，否则回传 false。

delete object.property
delete object['property']

const Employee = {
    name: 'Kay',
    age: 17
};

// Kay
console.log(Employee.name);

// 删除物件属性值
delete Employee.name;

// undefined
console.log(Employee.name);
// { age: 17 }
console.log(Employee);

delete 删除状况

如果你试图删除的属性不存在

delete 将不会起任何作用，但仍会 返回 true

const Employee = {
    name: 'Kay',
    age: 17
};

// 删除物件属性值
let deleteResult = delete Employee.job;

// true
console.log(deleteResult);
// { name: 'Kay', age: 17 }
console.log(Employee);

delete操作只会在 `自身的属性上起作用`

如果对象的原型链上有一个与待删除属性同名的属性，那麽删除属性之后，对象会使用原型链上的那个属性

// 动物
let animal = {
    // 会吃
    eats: true,
    walk : () => {
        console.log(`[animal] walking`);
    }
};
// 兔子
let rabbit = {
    // 会跳
    jumps: true,
    walk : () => {
        console.log(`[rabbit] walking`);
    }
};

// 设定兔子原型是动物
Object.setPrototypeOf(rabbit, animal)

// [rabbit] walking
rabbit.walk();

let deleteResult = delete rabbit.walk;

// true
console.log(deleteResult);
// [animal] walking
rabbit.walk();

任何使用 var 声明的属性不能从`全域`或`函数的作用域`中删除。

这样的话，delete操作不能删除任何在全域中的函数（无论这个函数是来自于函数声明或函数表达式）

除了在全域中的函数不能被删除，在 物件(object) 中的函数是能够用 delete 操作删除的。

删除物件中的函式成功

let Employee = {
    name : 'Kay',
    sayHi : function() {
        console.log(`Hi, I'm ${this.name}`);
    }
};

// Hi, I'm Kay
Employee.sayHi();

// { name: 'Kay', sayHi: [Function: sayHi] }
console.log(Employee);

let deleteResult = delete Employee.sayHi;
// true
console.log(deleteResult);

// { name: 'Kay' }
console.log(Employee);

删除 var 全域变数失败

var Employee = ['Kay', 'Jay', 'KJ'];

// [ 'Kay', 'Jay', 'KJ' ]
console.log(Employee);
let deleteResult = delete Employee;
// false
console.log(deleteResult);
// [ 'Kay', 'Jay', 'KJ' ]
console.log(Employee);

删除 var 函数的作用域变数失败

let testDeleteFunctionVariable = () => {
    var Employee = ['Kay', 'Jay', 'KJ'];

    // [ 'Kay', 'Jay', 'KJ' ]
    console.log(Employee);
    let deleteResult = delete Employee;
    // false
    console.log(deleteResult);
    // [ 'Kay', 'Jay', 'KJ' ]
    console.log(Employee);
};


testDeleteFunctionVariable();

删除 var 函数变数失败

var testDeleteFunction = () => {
    console.log('test delete function');
};

// [Function: testDeleteFunction]
console.log(testDeleteFunction)

let deleteResult = delete testDeleteFunction;
// false
console.log(deleteResult);

// [Function: testDeleteFunction]
console.log(testDeleteFunction);

删除 var 函数作用域函式变数失败

var testDeleteFunction = () => {
    console.log('test delete function');
    var testDeleteClosureFunction = () => {
        console.log('test closure delete function');
    }

    // [Function: testDeleteClosureFunction]
    console.log(testDeleteClosureFunction)

    let deleteResult = delete testDeleteClosureFunction;
    // false
    console.log(deleteResult);

    // [Function: testDeleteClosureFunction]
    console.log(testDeleteClosureFunction);
};

testDeleteFunction();

任何用 let 或 const 定义的属性，不能够从它被定义的作用域中删除

删除 let 全域变数失败

let Employee = ['Kay', 'Jay', 'KJ'];

// [ 'Kay', 'Jay', 'KJ' ]
console.log(Employee);
let deleteResult = delete Employee;
// false
console.log(deleteResult);
// [ 'Kay', 'Jay', 'KJ' ]
console.log(Employee);

删除 let 函数的作用域变数失败

let testDeleteFunctionVariable = () => {
    let Employee = ['Kay', 'Jay', 'KJ'];

    // [ 'Kay', 'Jay', 'KJ' ]
    console.log(Employee);
    let deleteResult = delete Employee;
    // false
    console.log(deleteResult);
    // [ 'Kay', 'Jay', 'KJ' ]
    console.log(Employee);
};


testDeleteFunctionVariable();

删除 let 函数变数失败

let testDeleteFunction = () => {
    console.log('test delete function');
};

// [Function: testDeleteFunction]
console.log(testDeleteFunction)

let deleteResult = delete testDeleteFunction;
// false
console.log(deleteResult);

// [Function: testDeleteFunction]
console.log(testDeleteFunction);

删除 const 全域变数失败

const Employee = ['Kay', 'Jay', 'KJ'];

// [ 'Kay', 'Jay', 'KJ' ]
console.log(Employee);
let deleteResult = delete Employee;
// false
console.log(deleteResult);
// [ 'Kay', 'Jay', 'KJ' ]
console.log(Employee);

删除 let 函数作用域函数变数失败

let testDeleteFunction = () => {
    console.log('test delete function');
    let testDeleteClosureFunction = () => {
        console.log('test closure delete function');
    }

    // [Function: testDeleteClosureFunction]
    console.log(testDeleteClosureFunction)

    let deleteResult = delete testDeleteClosureFunction;
    // false
    console.log(deleteResult);

    // [Function: testDeleteClosureFunction]
    console.log(testDeleteClosureFunction);
};

testDeleteFunction();

删除 const 函数的作用域变数失败

const testDeleteFunctionVariable = () => {
    const Employee = ['Kay', 'Jay', 'KJ'];

    // [ 'Kay', 'Jay', 'KJ' ]
    console.log(Employee);
    let deleteResult = delete Employee;
    // false
    console.log(deleteResult);
    // [ 'Kay', 'Jay', 'KJ' ]
    console.log(Employee);
};


testDeleteFunctionVariable();

删除 const 函数变数失败

const testDeleteFunction = () => {
    console.log('test delete function');
};

// [Function: testDeleteFunction]
console.log(testDeleteFunction)

let deleteResult = delete testDeleteFunction;
// false
console.log(deleteResult);

// [Function: testDeleteFunction]
console.log(testDeleteFunction);

删除 const 函数作用域函数变数失败

const testDeleteFunction = () => {
    console.log('test delete function');
    const testDeleteClosureFunction = () => {
        console.log('test closure delete function');
    }

    // [Function: testDeleteClosureFunction]
    console.log(testDeleteClosureFunction)

    let deleteResult = delete testDeleteClosureFunction;
    // false
    console.log(deleteResult);

    // [Function: testDeleteClosureFunction]
    console.log(testDeleteClosureFunction);
};

testDeleteFunction();

不可设置的(Non-configurable)属性不能被移除

像 Math、Array、Object 内建物件的属性，以及使用 Object.defineProperty() 方法设置为不可设置的属性不能被删除。

内建物件的属性不可删除

let deleteResult = delete Math.PI;
// false
console.log(deleteResult);
// 3.141592653589793
console.log(Math.PI);

使用 `Object.defineProperty()` 方法设置为不可设置的属性不能被删除

let Employee = {
    name : 'Kay',
    age : 17
};
Object.defineProperty(Employee, 'name', {configurable: false});

// { name: 'Kay', age: 17 }
console.log(Employee);
// false
console.log(delete Employee.name);
// true
console.log(delete Employee.age);
// { name: 'Kay' }
console.log(Employee);

使用 delete 删除阵列元素

阵列元素删除后，资料还是在，取得阵列笔数还是取得 3 笔

使用 for in 轮询阵列不会取得删除的资料
使用 forEach 轮询阵列不会取得删除的资料

let Employee = ['Kay', 'Jay', 'KJ'];

// [ 'Kay', 'Jay', 'KJ' ]
console.log(Employee);

let deleteResult = delete Employee[1];
// true
console.log(deleteResult);

// [ 'Kay', <1 empty item>, 'KJ' ]
console.log(Employee);

// 3：阵列资料还是 3 笔
console.log(Employee.length);

// 使用 for in 轮询阵列不会取得删除的资料
for (let index in Employee) {
    // index: 0: Kay
    // index: 2: KJ
    console.log(`index: ${index}: ${Employee[index]}`);
}

// 使用 forEach 轮询阵列不会取得删除的资料
Employee.forEach((currentValue, index) => {
    // index: 0: Kay
    // index: 2: KJ
    console.log(`index: ${index}: ${currentValue}`);
});

使用 Array.splice() 删除阵列元素

使用 Array.splice() 删除元素资料会真的不见，会影响到原本的变数

let Employee = ['Kay', 'Jay', 'KJ'];

// [ 'Kay', 'Jay', 'KJ' ]
console.log(Employee);

// 使用 Array.splice() 删除阵列元素
Employee.splice(1, 1);

// [ 'Kay', 'KJ' ]
console.log(Employee);

// 2：阵列资料剩馀 2 笔
console.log(Employee.length);

参考资料

Donate KJ 贊助作者喝咖啡

如果這篇文章對你有幫助的話，可以透過下面支付方式贊助作者喝咖啡，如果有什麼建議或想說的話可以贊助並留言給我

If this article has been helpful to you, you can support the author by treating them to a coffee through the payment options below. If you have any suggestions or comments, feel free to sponsor and leave a message for me!

方式 Method	贊助 Donate
PayPal	https://paypal.me/kejyun
綠界 ECPay	https://p.ecpay.com.tw/AC218F1
歐付寶 OPay	https://payment.opay.tw/Broadcaster/Donate/BD2BD896029F2155041C8C8FAED3A6F8