今天做过的一道js题目解析

今天做过的一道js题目解析

time:2017-03-03 22:11:45

今天做题的时候，无意中做到一道这样的题：

var obj = {"key":"1", "value":"2"};
var newObj = obj;
newObj.value += obj.key;
console.log(newObj);

初看的时候，感觉好简单，当时就不加思索的给出了{"key": "1", "value":"3"}这个答案。后来结果可想而知，当然是做错了。当时自我感觉羞愧难当，要说这本来就是个很基础的题目，正确的答案当然是这样了：{"key": "1", "value":"21"}；看过答案以后，稍微思索一下，就能够得出这个答案，但是为什么初看的时候做错了呢？

后来想了想，归根到底，原因还是自己对JavaScript这门语言的基础知识掌握的不扎实。要说这道题目，主要考察的就是JavaScript中的Object对象、string字符串和“+”操作符的作用等知识点。如果说学JavaScript这么语言，没掌握这些基础的知识，那么你压根就不敢说自己懂JavaScript了吧。

具体的这些知识点的详解，在这里也不一一列举了，有太多书籍都有介绍过。如果有不懂的读者，可以自行百度或者通过看书去查阅了解。在这里，我推荐一本我觉得不错的书——《JavaScript高级程序设计》。

重新温习过相关的知识点以后，我又自己改动了一下题目，代码变成了这样：

//demo 01
var obj = {"key":"1","value":"2"};  //属性名也可以采用字符串的设置方式
var newObj = obj;
console.log(obj.key);   //"1"
console.log(typeof newObj.value);   //string
console.log(newObj.value);  //"2"
console.log(typeof newObj.value);   //string
newObj.value += obj.key;
console.log(newObj);    //{"key":"1", "value":"21"}

再改一下，变成下面的形式：

//demo 02
var obj = {key:1,value:2};  //属性名也可以采用这种方式，将属性值变成数值
var newObj = obj;
console.log(obj.key);   //1
console.log(typeof newObj.value);   //number
console.log(newObj.value);  //2
console.log(typeof newObj.value);   //number
newObj.value += obj.key;
console.log(newObj);    //{"key":1, "value":3}

我相信，大部分入门了JavaScript这门语言的读者，看了上面两个demo变体之后，都应该一目了然，懂得了这道题的原理了。

编程语言的掌握真的不是一件易事，至少对于我这个刚入门的小白来说，的确是这样的。

本人只是一枚前端小白，以上有一些个人的拙见，若喷请轻喷，也欢迎同样跟我奋斗在前端道路上的新手童鞋跟我交流学习，我的个人邮箱是：wuzhiqin@yahoo.com，欢迎叨扰。