刷题 | 牛客 - js中等题-下（更ing）30/54知识点&解答

知识点汇总：

数组：

Array.prototype.pop()：从数组末尾删除一个元素，并返回这个元素。

Array.prototype.shift()：从数组开头删除一个元素，并返回这个元素。

array.reverse()：将数组元素反转顺序。

array.join()：将数组 拼接成字符串。

JS30 回文字符串

描述

请补全JavaScript代码，要求以Boolean的形式返回参数字符串是否为回文字符串。

法一： array.pop() + array.shift()

取数组的前和后的字符做对比

            const _isPalindrome = string => {
                // 补全代码
                // 法四：
                let str = string.split('');
                while(str.length > 1){
                    if(str.pop()!=str.shift()){
                        return false;
                    }
                }
                return true;
            }

法二：字符串访问（字符串索引访问）

                // 前后字符相等，如何取到第一个字符，和最后一个字符
                let len = string.length
                for(let i = 0;i < len/2; i++){
                    if(string[i] != string[len-i-1]){
                        return false;
                    }
                }
                return true;

法三：数组反转【正序 array.join() 和 倒序 array.reverse().join()】

// 法三：
                // 字符串转数组并拼接，对比 从前往后 和 从后往前（倒过来），是否相等。
                let oldArr = string.split('').join()
                let newArr = string.split('').reverse().join();
                if(oldArr === newArr){
                    return true;
                }
                return false;

 法四：前后指针

        // 法四：
                let left = 0;
                let right = string.length - 1;
                while(left<right){
                    // 相等 则继续；不相等 则返回false
                    if(string[left] === string[right]){
                        left++;
                        right--;
                    }else{
                        return false;
                    }
                }
                return true;

知识点：

Array.prototype.pop()：从数组末尾删除一个元素，并返回这个元素。

Array.prototype.shift()：从数组开头删除一个元素，并返回这个元素。

array.reverse()：将数组元素反转顺序。

array.join()：将数组 拼接成字符串。

.join()  ，不写，则用 逗号 , （默认分隔符）拼接；

.join(’‘) ，传入 ''（空字符串），那么元素之间不会加任何符号，会直接拼接起来。

JS31 Proxy计数器

描述

请补全JavaScript代码，请给参数对象添加拦截代理功能，并返回这个代理，要求每当通过代理调用该对象拥有的属性时，"count"值加1，否则减1。

法一：

            let count = 0
            const _proxy = object => {
                // 补全代码
                // 法一：
                let proxy = new Proxy(object, {
                    get: function(target, propKey){
                        // has：检查属性是否存在
                        if(propKey in target){
                            count++;
                        }else{
                            count--;
                        }
                    }
                })
                return proxy;
            }

★🧠 知识点 —— Proxy代理

Proxy代理，es6的新特性，用于创建对象的代理，可以在对象的访问 或 操作被执行时 进行 拦截 或 自定义处理。

是元编程工具，可以在不修改原对象下，控制其行为。

语法：

const proxy = new Proxy(target, handler);

• target：你要代理的原始对象。
• handler：一个对象，里面定义了拦截操作的方法（称为“捕捉器”或“陷阱” trap）。

Reflect 的作用：在 handler 中，使用 Reflect 是为了以更一致、更安全的方式调用原始操作，比如：

Reflect.get(target, prop, receiver) <----> target[prop]

Reflect.set(target, prop, value, receiver) <------> target[prop] = value

Reflect.get(target, prop, receiver) // 等价于 target[prop] 
Reflect.set(target, prop, value, receiver) // 等价于 target[prop] = value

✅ Proxy代理的 典型应用场景

1. 数据监控（如 Vue2 的响应式原理）

2. 访问权限控制

3. 属性校验（比如类型检查）

4. 自动记录日志（如访问次数）

5. 默认值处理

📚 常用拦截方法（Trap）

1. Proxy(被代理的对象，处理方法)

• Proxy(target, handler)：代理一个对象，handler 里可以定义 拦截的行为（如 get、set）。

2. get(要代理的对象，读取的属性，)

get(target, prop, receiver)：当你访问 proxy.prop 时，get 被触发。

3. Reflect.get(...)

• 用来返回实际的属性值，相当于 target[prop]，但更安全、更规范。

例子：

1. get 和 set：访问和修改属性

   const proxy = new Proxy(obj, {

        get(target, prop, receiver){

                console.log(`读取了属性${prop}`);

                count++;

                return Reflect.get(target, prop, receiver);        // 安全地返回原属性

        },

        set(target, prop, value, receiver){

                console.log(`设置属性"${prop}"为${value}`);

                return Reflect.set(target, prop, value, receiver);   // 安全地设置值

        }

})；

console.log(proxy.name);        // 触发 get

proxy.age = 18;                        // 触发 set

2. has：检查属性是否存在

const proxy = new Proxy({ a: 1}, {
    has(target, prop){
        console.log(`判断"${prop}"是否在对象中`);
        return prop in target;
    }
})
console.log('a' in proxy);

3. deleteProperty: 删除属性

const proxy = new Proxy({ name: 'Tom'}, {
    deleteProperty(target, prop){
        console.log(`删除属性"${prop}"`);
        return Reflect.deleteProperty(target, prop);
    }
})
delete proxy.name;