js操作对象

Question

有5个字母 a,b,c,d,e 和5组数字 1,10,100,1000,10000

期望(前面为按钮，后面为显示器显示结果)：

a => a
a 10 => a10
a 10 100 => a110
a 10 100 b => a110b
a 10 100 b 10=> a110b10
a 10 100 b 10 a 100 => a210b10
....


var Ainput='' //模拟点击字母按钮
var Sinput='' //模拟点击数字按钮
var str = '' //模拟显示器
var obj = {a:'',b:'',c:'',d:'',e:''}

Answer 1

因为这10组都是按钮,所以我这里把Ainput和Sinput都声明为函数,前者传入的参数是字母,后者是数字.
另 由于各种原因,本答案不考虑任何用户输入不规范的因素
答案如下:

var str="",//最终显示的字符串
    status=null,//记录当前的字母是哪个
    obj={
        a:{ hasClicked:false, value:null },//hasClicked记录字母是否被点击过,value记录数值
        b:{ hasClicked:false, value:null },
        c:{ hasClicked:false, value:null },
        d:{ hasClicked:false, value:null },
        e:{ hasClicked:false, value:null }
    };
 var Ainput=function(letter){//允许的值有"a","b","c","d","e"
    status = letter;
    obj[status].hasClicked = true;
    getStr();
}
var Sinput=function(number){//允许的值是number类型,可以不止为题目的 1,100,1000
    
    obj[status].value += number;
    getStr();
}
var getStr=function(){
    str="";
    for(let i in obj){
        if(obj[i].hasClicked)
            str+=i;
        if(obj[i].value!==null)
            str+=obj[i].value;
    }
}
var initInput=function(){//多写一个函数以初始化条件
    str="",
    status=null,
    obj={
        a:{ hasClicked:false, value:null },
        b:{ hasClicked:false, value:null },
        c:{ hasClicked:false, value:null },
        d:{ hasClicked:false, value:null },
        e:{ hasClicked:false, value:null }
    };
}
///下面来尝试几个输入,看看结果
//a => a
Ainput("a");
console.log(str)//=>a ,没毛病

//a 10 100 b 100
initInput();
Ainput("a");
Sinput(10);
Sinput(100);
Ainput("b");
Sinput(100);
console.log(str)//=>a110b100, 正确

//a 10 100 b 10 a 100
initInput();
Ainput("a");
Sinput(10);
Sinput(100);
Ainput("b");
Sinput(10);
Ainput("a");
Sinput(100);
console.log(str)//=>a210b10, 完美

以上

Answer 2

https://codesandbox.io/s/xeno...

具体的变量可以从代码中拿到。

Answer 3

看起来就是做一个简单的统计累加吧，把字符串按空格分开，然后遍历进行统计不就行了。