@value 默认值不生效_17个你可能还不知道 JS 技巧！

左手的ㄟ右手 2023-01-01 09:55 274阅读 0赞

## 1.三元运算符 ##

**新手**

let hungry = true;
    let eat; 
    if (hungry == true) {
           eat = 'yes'; 
    } else {
           eat = 'no';
    }

**老手**

let hungry = true;
    let eat = hungry == true ? 'yes' : 'no';

## 2.数字转字符串/字符串转数字 ##

**新手**

let num = 15; 
    let s = num.toString(); // number to string
    let n = Number(s); // string to number

**老手**

let num = 15;
    let s = num + ""; // 数字转字符串
    let n = +s; // 字符串转数字

## 3.填充数组 ##

**新手**

for(let i=0; i < arraySize; i++){
      filledArray[i] {'hello' : 'goodbye'};
    }

**老手**

let filledArray = new Array(arraysize).fill(null).map(()=> ({'hello' : 'goodbye'}));

## 4.对象的动态属性 ##

**新手**

let dynamic = "value"; 
    let user = {
         id: 1,
    };
    user[dynamic]: "other value";

**老手**

let dynamic = "value"; 
    let user = {
        id: 1,
        [dynamic] = "other value"
    };

## 5.删除重复项 ##

**新手**

**老手**

let array = [100, 23, 23, 23, 23, 67, 45]; 
    let outputArray = Array.from(new Set(array))

## 6. 数组到对象 ##

**新手**

let arr = ["value1", "value2", "value3"]; 
    let arrObject = {};
    for (let i = 0; i < arr.length; ++i) {
       if (arr[i] !== undefined) {
         arrObject[i] = arr[i];
       }
    }

**老手**

let arr = ["value1", "value2", "value3"]; 
    let arrObject = {...arr};

## 7.对象到数组 ##

**新手**

**老手**

let number = {
      one: 1, 
      two: 2,
    };
    let key = Object.keys(numbers); // key = [ 'one', 'two' ]
    let value = Object.values(numbers);  // value = [ 1, 2 ]
    let entry = Object.entries(numbers); // entry = [['one' : 1], ['two' : 2]]

## 8. 短路条件 ##

**新手**

if (docs) {
        goToDocs();
    }

**老手**

docs && goToDocs()

## 9. 使用`^`检查数字是否相等 ##

if(a!=123) // before // 一般开发者
    
    if(a^123) // after // B格比较高的

## 10.对象遍历 ##

## 11. 获取对象的所有键 ##

cosnt obj = {
      name: "前端小智", 
      age: 16, 
      address: "厦门", 
      profession: "前端开发", 
    }; 
    
    console.log(Object.keys(obj)); // name, age, address, profession

## 12.检查值是否为数组 ##

const arr = [1, 2, 3]; 
    console.log(typeof arr); // object
    console.log(Array.isArray(arr)); // true

## 13.初始化大小为n的数组并填充默认值 ##

const size = 5;
    const defaultValue = 0;
    const arr = Array(size).fill(defaultValue);
    console.log(arr); // [0, 0, 0, 0, 0]

## 14. 真值和虚值 ##

虚值：`false`,`0`, `""`,`null`,`undefined`和`NaN`。

真值：`"Values"`,`0"`,`{}`,`[]`。

## 15. 三等号和双等号的区别 ##

// 双等号 - 将两个操作数转换为相同类型,再比较
    console.log(0 == 'o'); // true
    
    // 三等号 - 不转换为相同类型
    console.log(0 === '0'); // false

## 16. 接收参数更好的方式 ##

function downloadData(url, resourceId, searchTest, pageNo, limit) {}
    
    downloadData(...); // need to remember the order

更简单的方法

function downloadData(
    { url, resourceId, searchTest, pageNo, limit } = {}
    ) {}
    
    downloadData(
      { resourceId: 2, url: "/posts", searchText: "WebDev" }
    );

## 17.null vs undefined ##

null =>它是一个值，而`undefined`不是。

const fn = (x = 'default value') => console.log(x);
    
    fn(undefined); // default value
    fn(); // default value
    
    fn(null); // null

传递`null`时，不采用默认值，而 `undefined`或未传递任何内容时，将采用默认值。

零基础如何迅速学习前端？www.zhihu.com

![440e10f3359791d75f8ecd3ac70982d5.png][]

> 作者：Rahul  
> 译者：前端小智  
> 链接：17个你可能还不知道 JS 技巧！  
> 来源：segmentfault  
> 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

[440e10f3359791d75f8ecd3ac70982d5.png]: /images/20221120/542e3f9f30c2443fa1800223683f8c7b.png