js方法合集

path路径解析方法

function parseURL(url) {
    const result = {
        path: [],
        params: [],
    };
    const parts = url.split('?');
    result.path.push(parts[0]);
    if (parts.length > 1) {
        const paramsStr = parts[1];
        const paramsArray = paramsStr.split('&');
        paramsArray.forEach(param => {
            const keyValue = param.split('=');
            result.params.push({
                [keyValue[0]]: keyValue[1],
            });
        });
    }
    return result;
}
console.log(parseURL('https:xxx/cdn/blob/main/Object.js?username=xiaoji&age=20'));

计算百分比均匀分配为100%

function calculatePercentages(data) {
    // 计算总和
    const total = data.reduce((acc, val) => acc + val, 0);
    const percentages = [];
    // 计算每个数据项的百分比，并取整
    for (let i = 0; i < data.length; i++) {
        const percentage = Math.round((data[i] / total) * 100);
        percentages.push(percentage + '%'); // 在这里添加百分号
    }
    // 对最后一个数据项进行修正以确保总和为 100%
    const totalPercentage = percentages.reduce((acc, val) => acc + parseInt(val), 0);
    const lastPercentageAdjustment = 100 - totalPercentage;
    percentages[percentages.length - 1] = (parseInt(percentages[percentages.length - 1]) + lastPercentageAdjustment) + '%';
    return percentages;
}
const data = [10, 20, 7, 29, 15];
const percentages = calculatePercentages(data);
console.log(percentages); // 输出每个数据项的百分比，带上百分号 ["12%","25%","9%","36%","18%"],相加刚好100%

根据id找到数组内对应元素

function findElementById(array, id) {
    // 使用数组的 find 方法来查找元素
    return array.find(element => element.id === id);

// 使用示例
const elements = [
    { id: 1, name: 'Element 1' },
    { id: 2, name: 'Element 2' },
    { id: 3, name: 'Element 3' }
]
const element = findElementById(elements, 2);
console.log(element); // 输出: { id: 2, name: 'Element 2' 
const nonExistingElement = findElementById(elements, 4);
console.log(nonExistingElement); // 输出: undefined

找到数组内符合条件的元素并修改其属性

// 例如找到数组内checked为true的元素,修改对应元素的color改成红色
function updateCheckedElementsColor(array) {
    // 使用 forEach 方法遍历数组
    array.forEach(element => {
        if (element.checked === true) {
            // 如果元素的 checked 属性为 true，则将 color 属性设置为 '红色'
            element.color = '红色';
        }
    });
}
// 使用示例
const elements = [
    { id: 1, name: 'Element 1', checked: false, color: 'blue' },
    { id: 2, name: 'Element 2', checked: true, color: 'green' },
    { id: 3, name: 'Element 3', checked: true, color: 'yellow' }
];
// 更新数组中 checked 为 true 的元素的颜色
updateCheckedElementsColor(elements);
// 打印更新后的数组
console.log(elements);

数组的正序倒序排序

// 根据数组的count值进行排序,参数一是数组,参数二控制正序还是倒序
function sortByCount(array, ascending) {
    // 使用数组的 sort 方法进行排序
    array.sort((a, b) => {
        // 如果是正序排序（ascending为true），返回a.count - b.count
        // 如果是倒序排序（ascending为false），返回b.count - a.count
        return ascending ? a.count - b.count : b.count - a.count;
    });
}

// 使用示例
const elements = [
    { id: 1, name: 'Element 1', count: 10 },
    { id: 2, name: 'Element 2', count: 5 },
    { id: 3, name: 'Element 3', count: 20 }
];
// 正序排序
sortByCount(elements, true);
console.log('正序排序:', elements);
// 倒序排序
sortByCount(elements, false);
console.log('倒序排序:', elements);