js 常见编程题

2017-03-12  本文已影响0人  WPeach
  1. 写一个求和的函数sum,达到下面的效果
// Should equal 15
sum(1, 2, 3, 4, 5);
// Should equal 0
sum(5, null, -5);
// Should equal 10
sum('1.0', false, 1, true, 1, 'A', 1, 'B', 1, 'C', 1, 'D', 1,
  'E', 1, 'F', 1, 'G', 1);
// Should equal 0.3, not 0.30000000000000004
sum(0.1, 0.2);

实现:

function sum(){
    var result = 0;
    for( var i=0; i<arguments.length; i++){
        result += (!isNaN(arguments[i]))&&window.parseFloat(arguments[i])||0;
    }
    return result.toFixed(3)*1000/1000;
}

讲解:
parseFloat的结果要么为一个小数,要么为NaN,||运算如果前一个为真则不计算后一个,直接返回前一个表达式的值,如果是NaN则返回后一个表达式的值;
nResult.toFixed(3) * 1000 / 1000 这个是在做:保留三位小数,并且去掉末尾的0,最后一位会进行四舍五入。

  1. 写一个traverse函数,输出所有页面宽度和高度大于50像素的节点。
function traverse(){
    return Array.prototype.filter.call(document.querySelectorAll('body *'), function(node){
        return node.offsetWidth > 50 && node.offsetHeight > 50;
    });
}
  1. js常用设计模式的实现思路,单例,工厂,代理,装饰,观察者模式等
 // 1) 单例: 任意对象都是单例,无须特别处理

    var obj = {name: 'michaelqin', age: 30};

    // 2) 工厂: 就是同样形式参数返回不同的实例
    function Person() { this.name = 'Person1'; }
    function Animal() { this.name = 'Animal1'; }

    function Factory() {}
    Factory.prototype.getInstance = function(className) {
        return eval('new ' + className + '()');
    }

    var factory = new Factory();
    var obj1 = factory.getInstance('Person');
    var obj2 = factory.getInstance('Animal');
    console.log(obj1.name); // Person1
    console.log(obj2.name); // Animal1

    //3) 代理: 就是新建个类调用老类的接口,包一下
    function Person() { }
    Person.prototype.sayName = function() { console.log('michaelqin'); }
    Person.prototype.sayAge = function() { console.log(30); }

    function PersonProxy() {
        this.person = new Person();
        var that = this;
        this.callMethod = function(functionName) {
            console.log('before proxy:', functionName);
            that.person[functionName](); // 代理
            console.log('after proxy:', functionName);
        }
    }

    var pp = new PersonProxy();
    pp.callMethod('sayName'); // 代理调用Person的方法sayName()
    pp.callMethod('sayAge'); // 代理调用Person的方法sayAge()

    //4) 观察者: 就是事件模式,比如按钮的onclick这样的应用.
    function Publisher() {
        this.listeners = [];
    }
    Publisher.prototype = {
        'addListener': function(listener) {
            this.listeners.push(listener);
        },

        'removeListener': function(listener) {
            delete this.listeners[listener];
        },

        'notify': function(obj) {
            for(var i = 0; i < this.listeners.length; i++) {
                var listener = this.listeners[i];
                if (typeof listener !== 'undefined') {
                    listener.process(obj);
                }
            }
        }
    };

 // 发布者
    function Subscriber() {

    }
    Subscriber.prototype = {
        'process': function(obj) {
            console.log(obj);
        }
    }; 

   // 订阅者
    var publisher = new Publisher();
    publisher.addListener(new Subscriber());
    publisher.addListener(new Subscriber());
    publisher.notify({name: 'michaelqin', ageo: 30}); // 发布一个对象到所有订阅者
    publisher.notify('2 subscribers will both perform process'); // 发布一个字符串到所有订阅者
上一篇 下一篇

猜你喜欢

热点阅读