JS疑难点和GC原理

2022-10-04 14:26:51

js解析与序列化json数据(一)json.stringify()的基本用法：

对象有两个方法：stringify()和parse()。在最简单的情况下，这两个方法分别用于把JavaScript对象序列化为JSON字符串和把JSON字符串解析为原生JavaScript。早期的JSON解析器基本上就是使用JavaScript的eval()函数。由于JSON是JavaScript语法的自己，因此eval()函数可以解析、解释并返回JavaScript的对象和数组。

ECMAScript 5对解析JSON的行为进行了规范，定义了全局对象JSON。

JSON对象有两个方法：stringify()和parse()。在最简单的情况下，这两个方法分别用于把JavaScript对象序列化为JSON字符串和把JSON字符串解析为原生JavaScript。例如：

<html>

<head>

<title></title>

<script type="text/javascript">

function init()

{

var book={

title:"JavaScript高级程序设计",

authors:[

"Nicholas C. Zakas"

],

edition:3,

year:2011

};

var jsonBook=JSON.stringify(book);

var objectBook=JSON.parse(jsonBook);

var title=objectBook.title;} </script> </head> <body> <input type="button" onclick="init()" value="测试" /> </body> </html> 

默认情况下，JSON.stringify()输出的JSON字符串不包含任何空字符或缩进，因此保存在jsonBook中的字符串如下所示：

复制代码 代码如下:

{"title":"JavaScript高级程序设计","authors":["Nicholas C. Zakas"],"edition":3,"year":2011} 

在序列化JavaScript对象时，所有函数及原型成员都会被有意忽略，不体现在结果中。此外，值为undefined的任何属性也都会被跳过。结果中最终都是值为有效JSON数据类型的实例属性。 

注意，虽然book与objectBook具有相同的属性，但它们是两个独立的、没有任何关系的对象。如果传给JSON.parse()的字符串不是有效的JSON，该方法会抛出错误。

1. JS中的typeof是一元操作符，不是函数

　　在chrome的Console控制台上，输入typeof null,它会输出"object"。因此，使用typeof操作符的时候，除了null，都会识别出其他数据的类型。

2. JS中的instanceof来区分Object下的Array、Json、RegEx、Date、Function、Error、Math

　　instanceof对于非对象，返回false

　　instanceof对于原型链上的对象，返回原型链对象

3. Object转String和Object转Number的方法

　　Object->toString()->valueOf()->String

　　Object->valueOf()->toString()->Number

4. JS如何处理解析Json数据

// 先来看一个js中的eval()函数 
　 var the_unevaled_answer = "2 + 3";

   var the_evaled_answer = eval("2 + 3");

   alert("the un-evaled answer is " + the_unevaled_answer + " and the evaled answer is " + the_evaled_answer); 

运行结果：alert: the un-evaled answer is 2 + 3 and the evaled answer is 5

　　解析Json数据之前，我们先来认识一下，到底什么是Json数据。从结构上看，世界上的所有的数据（data）最终都可以分解成三种类型：

第一种类型是标量（scalar），也就是一个单独的字符串（string）或数字（numbers），比如"北京"这个单独的词。

第二种类型是序列（sequence），也就是若干个相关的数据按照一定顺序并列在一起，又叫做数组（array）或列表（List），比如"北京，上海"。

第三种类型是映射（mapping），也就是一个名/值对（Name/value），即数据有一个名称，还有一个与之相对应的值，这又称作散列（hash）或字典（dictionary），比如"首都：北京"。

这就是构成世界的最基本的数据类型，所以你看在任何一门编程语言中，有了数组和对象就可以存储一切数据了。数组也是对象，这是对的。但数组表示有序数据的集合，而对象表示无序数据的集合。如果数据的顺序很重要，就用数组，否则就用对象。说完这个，我们再来说说Json，它也比较有意思。对于Json数据格式的规定，已特别巧妙的规范了传输中的数据样式

1） 并列的数据之间用逗号（", "）分隔。

2） 映射用冒号（": "）表示。

3） 并列数据的集合（数组）用方括号("[]")表示。

4） 映射的集合（对象）用大括号（"{}"）表示。

数据交换，说白点儿就是通信。两者之间通信，才需要有数据交换，如Android内嵌HTML5页面，当需要数据交互的时候，就会有数据的传递，那么封装成Json格式，是一个非常方便的想法。接下来看看具体JS的json格式的解析

　　 var t="{'firstName': 'cyra', 'lastName': 'richardson'}";

    var jsonobj=eval('('+t+')');

    alert(jsonobj.firstName);

    alert(jsonobj.lastName);  
　　运行结果：

　　　　alert: cyra
　　　　alert: richardson

var t2="[{name:'zhangsan',age:'24'},{name:'lisi',age:'30'},{name:'wangwu',age:'16'},{name:'tianqi',age:'7'}] ";

var myobj=eval(t2);

for(var i=0;i<myobj.length;i++){

   alert(myobj[i].name);

   alert(myobj[i].age);

}  
运行结果：

alert: zhangsan
alert: 24
alert: lisi
alert: 30
alert: wangwu
alert: 16
alert: tianqi
alert: 7

var t3="[['<a href=# onclick=openLink(14113295100,社旗县国税局桥头税务所,14113295100,d6d223892dc94f5bb501d4408a68333d,swjg_dm);>14113295100</a>','社旗县国税局桥头税务所','社旗县城郊乡长江路西段']]";

//通过eval() 函数可以将JSON字符串转化为对象

var obj = eval(t3);

for(var i=0;i<obj.length;i++){

   for(var j=0;j<obj[i].length;j++){

　　　　alert(obj[i][j]);

   }

}  
运行结果：

　　alert: <a href=# onclick=openLink(14113295100,社旗县国税局桥头税务所,14113295100,d6d223892dc94f5bb501d4408a68333d,swjg_dm);>14113295100</a>
　　alert: 社旗县国税局桥头税务所
　　alert: 社旗县城郊乡长江路西段

既然是Json的交互，那么我们来看看JS中将要传输的数据封装成JSON数据。

var t3="[['<a href=# onclick=openLink(14113295100,社旗县国税局桥头税务所,14113295100,d6d223892dc94f5bb501d4408a68333d,swjg_dm);>14113295100</a>','社旗县国税局桥头税务所','社旗县城郊乡长江路西段']]";

//通过eval() 函数可以将JSON字符串转化为对象

var obj = eval(t3);  
//stringifier 函数的作用跟 parse 相反， 用来将一个js对象转换为 JSON 文本。 
var jsonText = JSON.stringify(obj);  
alert(jsonText); 
运行结果：alert: [["<a href=# onclick=openLink(14113295100,社旗县国税局桥头税务所,14113295100,d6d223892dc94f5bb501d4408a68333d,swjg_dm);>14113295100</a>","社旗县国税局桥头税务所","社旗县城郊乡长江路西段"]]

//如果基于安全的考虑的话，最好是使用一个 JSON 解析器。 一个 JSON 解析器将只接受 JSON 文本。所以是更安全的。

var myObject = JSON.parse(myJSONtext, filter);

//可选的 filter 参数将遍历每一个value key 值对， 并进行相关的处理。如：

myData = JSON.parse(text, function (key, value) {

　　　　　　　　　　　　　　　　　　return key.indexOf('date') >= 0 ? new Date(value) : value;    
　　　　　　　　　　　　　　　 });

//stringifier 函数的作用跟 parse 相反， 用来将一个js对象转换为 JSON 文本。

var myJSONText = JSON.stringifier(myObject);

*/

5.什么是Git，Git是的作者是谁？

　　Git是一个开源的分布式版本控制系统，用以有效、高速的处理从很小到非常大的项目版本管理。Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。使用Git的优点：适合分布式开发，强调个体。公共服务器压力和数据量都不会太大。速度快、灵活。任意两个开发者之间可以很容易的解决冲突。离线工作。

6. 常见的JS事件

　　onmouseover="" onmouseout="" 适用于PC端，鼠标的移入和移出

　　document.getElementById('');可以解决浏览器的兼容性问题.必须要用id选择器，让该选择兼容所有浏览器

　　document.getElementById('').style.width="300px";

　　<link rel="stylesheet" type="text/css" href="" id="link01"> 任何标签都可以加属性;任何标签的属性都可以修改。

　　<input title="" value="">value是默认要显示的值;title是用来提示input要输入的内容的。

　　<a href="#"></a>不跳转，但是页面会回到顶部。

　　<a href="javascript:alert('a');"></a>但常常放空，<a href="javascript:"></a>页面一点点变化都都没有，且不跳转。

　　<input type="checkbox" id="check1"> 设置被选中为:document.getElementById('check1').checked=true;

　　在js中.表示对象的属性，有一个例外:class.由于它是js的保留字，故在js中使用class的时候，得用className，如下：

<style>

    #div1 {background: black}

    .box {background: red;}

</style>

<script>

    function toRed(){

        var obj = document.getElementById('div1');

        obj.className=box;       //这里的class是JS的关键字，避讳需要，要换成className，唯一例外。

    }

</script>

<body>

    <div id="div1">

    </div>

</body>

　　JS中传参，参数数据类型的说明，如

<script>

   function show (data) {

        alert(data);

    }

show(123);

show("abc");

var json1 = {"name":"zxg", "sex":"male"};

show(json1);

var json2 = "{"name":"zxg", "sex":"male"}";

show(json2)

</script>

运行结果：

alert: 123

alert: abc

alert: [object Object]

Uncaught SyntaxError: Unexpected identifier(报了语法错误)

// 再来看一组, 之所以会出现这种现象，你要知道 data只是一个别名，一个外号而已。真正的值是看传过来的参数是什么样的类型，那么它就怎么表现，它只是为传过来的参数占个位置而已
function show (data) {

        alert(data[0]);alert(data[1]);

    }

show('abc');
运行结果：

alert: a

alert: b

function plus (a, b){
　　alert(a+b);
　　alert("a"+b);
　　alert("a"+"b");
}
plus(5,12);
运行结果：

alert: 17
alert: a12
alert: ab

7. 关于div属性display的说明

<div class="nav"> <a href="home">首页</a> <a href="about">关于我们</a> <a href="contact">联系我们</a> </div> 类.nav定义如下： .nav a {display:block;}

为了方便显示，我们给a标签定了背景颜色（backgrou-color:#FF9966）右边界（margin-right:10px） 下边界（margin-bottom:10px） 填充（padding:10px）。

Block以块状显示，样式如下：

inline以内嵌的样式显示，如下：

none属性，不显示且不占用物理空间。

8. 说说JS中操作属性的几种方式

第一种方式是通过.操作符，另外一种是通过['']这种方式来操作属性，如：

document.getElementById("");

document['getElementById']=;   //使用[]来操作属性的方便之处是：里面可以放变量。如

9. JS中变量和字符串的区别

　　JS中有一个名词叫做，字面量。即看到即知道。比如看到123就知道是数字123.如看到'abc'就知道字符串abc.这个名词java中叫常量。

//  那么我们来看代码如下：

alert(a);    //并不知道a是什么，a是变量。

alert("abc");     //看到就知道abc是字符串，abc是常量

所以，我们知道JS中对于“”和’‘没有区分，但是加引号和不加引号还是要区分的。对于变量和参数是不能加引号的。加引号就有了常量的嫌疑了。

10. style加样式加的是行间样式

　　在这里涉及到一个样式的优先级的概念，*通配符<标签(如div input)<class<id<行间。行间样式的优先级是最高的。这里涉及到一个style和className的关系，如果你先修改了元素的.sytle属性，再去修改className是不会有效果的。

　　行间事件是危险的，所以我们接下来说说提取行间事件，如何解决这种麻烦。

<input type="button" value="Submit" onclick="change();" id="input1">
其实，你看看onclick也是标签input的一个属性，既然我们在JS中能够document.getElementById('input1').value='提交';我们通过这种方式修改了input标签中的value属性，那么对于特殊的onclick能不能使用这种方式来修改呢。答案是可以的,方式如下：
<script>
　　function abc () {
　　　　alert("you can you up!");
　　}
　　var but = document.getElementById('input1');
　　but.onclick=abc;
</script>

// 说到这里，再来补充一点知识：JS中的匿名函数问题，如果不想给函数起名字，上面的代码可以这样来写：
<script>
　　var but =  document.getElementById('input1');
　　but.onclick = function () {
　　　　alert("you are my honey.");      // 这个知识点叫做匿名函数
　　}
</script>

11. 一段<script>和</script>代码放在一个HTML页面的什么位置，比较合适。

　　对于上面的代码，如果放在<head></head>标签内部，则会先执行<head>中的JS，才去执行<body>中的内容，但是你会发现，浏览器此时对于JS中的document.getElementById('input1');根本不知道input1是什么东东。那么我们接下来说说window.onload.一看on开头就知道是事件。window.onload是页面加载完就立即执行。

12. 提取事件和获得一组元素

　　说完了上面的window.onload的作用，我们再来看看如何获得一组元素，众所周知getElementById是获得唯一的id，那么获得一组元素，还有一个方法叫做getElementsByTagName,你看这个方法中的Elements是复数，那么显而易见了。

13. 说说JS中的this

　　this含义就是当前发生事件的元素。

14.说说JS中的innerHTML

　　其实这个也超级简单的，innerHTMl就是两个字:inner和HTML。意思就是里面的HTML。那么引申开来的讲:里面的html，在里面使用标签，是能够被解释执行的。

15. 说说JS中定义数组

　　var array = [1,2,3,4,5,6,7,8]; 中括号中放的都是并列的数据内容。 "123"+5+13+"da" =="123513da"字符串的拼接。

16. 你知道JS的组成是什么吗？

　　ECMAScript是JS最核心的，它是JS的解释器。DOM文档对象模型，它在JS中就是document对象，它是JS操作HTML的入口。BOM浏览器对象模型，它让JS操作浏览器，它也代表一个对象window。

　　说说JS组成部分的兼容性问题：BOM完全不兼容。所以很少用。

17. 说说JS中的变量

　　typeof，字面意思：类型of...。

　　isNaN()函数用于检验输入的是否是数字。

18.说说JS中的字符串转数字　

<script>

    var a = document.getElementById('txt1');

    var b = document.getElementById('txt2');

    var c = document.getElementById('but1');

    c.onclick = function () {

        alert(parseInt(a.value)+parseInt(b.value));

    }

</script>

//设计之初 规定了input中放的是string类型的数据

<input id="txt1" type="text">

<input id="txt2" type="text">

<input id="but1" type="button">

<script>

    var a = parseInt('abc');    //NaN

    var b = parseInt('def');    //NaN

    alert(a==b);           //false

</script>

同时JS提供了判断是否是数字的函数：isNaN.常用方式如下：
if(isNaN(num)){
　　alert('your number is error.');
}

同样的parseInt是用来转换证书的，也有parseFloat用来转换带小数的数字。

19.JavaScript的基础知识总结：

　　说到JS，必须面对的一个问题就是JS的闭包：有些知识明明很简单，你却理解不清楚。闭包就是这样的，很恶心。
　　到底什么才叫做闭包：一句话来说，闭包就是子函数可以使用父函数的局部变量。

　　JS中变量命名采用的是匈牙利命名法，类型前缀+首字母大写。JS中的类型前缀有：数组a，布尔值b, 浮点数f，函数fn, 整数i，对象o，正则表达式re，字符串s，变量v。

　　求余运算符"%"和除法运算符"/"，运用：秒转时间和隔行变色都会用到"%"运算符。定时器也会用到这个知识点的。

　　算法运算符：+ - * / %

　　比较运算符：!= 和 !==分别对应着== 和===。== 和 != 比较若类型不同，先尝试转换类型，再作值比较，最后返回值比较结果。而 === 和 !== 只有在相同类型下,才会比较其值。

　　break和continue，break含义是：打破中断，continue含义是：继续。关于continue和break的最经典编程师范如下：

<script>

    for(int i = 0; i < 5; i++){

        if(i == 2){

            break;

        }

        alert(i);

    }

</script>    

<script>

    for(int i = 0; i < 5; i++){

        if(i == 2){

            continue;

        }

        alert(i);

    }

</script>

　　真的：true、非零数字、非空字符串、非空对象

　　假的：false、数字0、空字符串、空对象null、undifined。

　　Json是用来存数据的。Json和数组的区别：Json的下标实际上是一个字符串，而数组的下标其实是一个数字。

var json = {a:12, b:5, c:'abc'};

var arr = [12,5,7];

json.a 我们知道能用"."的地方,肯定能用[]代替，故json['a']

那么对于数组，我们只能用arr[0]来取出12.

// 由上得出结论很显然：json下标是字符串，数组下标是数字。
// 数组有arr.length。但是json没有。
// 数组有arr.length所以很好循环(另外数组还有一种for in的循环方法)，那么json没有长度怎么循环呢？很显然，用for in来遍历就可以循环json。  json用for in循环遍历

20. 函数传参和函数返回值，一个是进，一个是出。还是蛮对称的。

　　在JS中，return;这样返回的是undefined值。

　　arguments是一个(参数的)数组：故而可以对它可以求arguments.length()；arguments这个数组里面存的是传递给函数的参数。注意这里的这个函数是广泛意义上的所有函数，可不像Java里面的那样，只是public static void main()函数。
　　style提供的是行间样式。JS还提供了currentStyle来获得当前样式。currentStyle用于获得非行间样式。但是只有IE和Chrome支持currentStyle。FireFox还是不支持的。那么FireFox中采用的则是：getComputedStyle。针对上面这点：针对所有浏览器下都兼容的代码：由于undefined是false，所以采用if else语句，if...else...则完美的解决了这个问题。想想这个兼容真是棒！！

　　JS中 99%的东西都是采用这个if else方法来解决的。

　　JS中的概念：单一样式和复合样式。

　　创建数组的两种方式：var a = new Array(1,2,3); var b = [1,2,3]

21. 单独拿出来讲讲数组的小bug，既可以设置又可以获取。如

// case 1:

var a = [1,2,3,4,5,6,7,8,9]

alert(a.length); // 9

alert(a);  //1,2,3,4,5,6,7,8,9

a.length = 3;

alert(a);  //1,2,3

那么问题来了，快速清空一个数组方法：a.length = 0;

var a = [1,2,3];

alert(a); //1,2,3

a.push(4);

alert(a); //1,2,3,4

a.pop();  //从尾部删除

alert(a); // 1,2,3

a.shift();  //从头部删除

alert(a);  //2,3

a.unshift(1);  // 从头部添加

alert(a);  //1,2,3

// 数组中的splice

splice(起点, 长度) 用来删除元素

var a = [1,2,3,4,5,6,7,8];

a.splice(2,4);

alert(a); // 1,2,7,8

splice()插入元素的方法

var b = [1,2,3,4,5,6,7,8,9];

b.splice(2,0);

alert(b);  //1,2,3,4,5,6,7,8,9

b.splice(a,0,'a','b','c');

alert(b);  //1,2,a,b,c,3,4,5,6,7,8,9

// concat的用法：

var a = [1,2,3];

var b = [4,5,6];

alert(a.concat(b)); // 1,2,3,4,5,6 将两个合并，a前b后

// join的用法：

var a =[1,2,3,4];

a.join('-');

alert(a);  //1-2-3-4

// 数组的排序：

var a = ['width','float','zoom','alpha'];

a.sort();

alert(a); //按照首字母a-z排序了：‘alpha’,'float','width','float'

var b = [12,8,99,19,112];

b.sort();

alert(b); // 112,12,19,8,99 它没有按照数字的大小进行排序，关于这点你可以联想一下windows中对照片进行排序的时候，是不是也是这种策略的啊。。
// 原因在于sort()方法把上面的认为是字符串。

实现比较函数：

var b = [12,8,99,19,112];
b.sort(function(n1,n2){   //这个用来比较的数值的大小  而不是原始的sort比较的是字符串。
　　return n1-n2;
})
alert(b);  // 8,12,19,99,112

1. Java中垃圾回收机制与C++中内存回收的对比，

　　C++中的内存机制，像是自助餐厅。用餐完毕需要自己动手清扫桌子，碗筷。

　　Java中的内存机制，像是高级餐厅，有一个叫做GC的服务员，专门在客人用餐完毕后，清扫桌子，打扫环境卫生。

2. Java中的垃圾回收

　　垃圾，我们知道java的对象是放在堆中的。程序员不直接操纵堆中的对象，而是通过对堆中对象的引用，来通过操作引用来操作对象。有点像提线木偶。

　　回收，在Java中回收，使用System.gc()方法，建议虚拟机回收。回收前一般会使用finalize()方法，用来释放对象的资源。

3. Java的源程序在编译的时候都做了些什么？

　　在编译原理中，我们知道编译的一般步骤是：词法分析->语法分析->中间代码生成->代码优化->目标代码生成。java在编译时，编译器会检查所有程序的基本语法，包括检查调用方法所传的参数类型，如果找到错误则立即报错，编译就无法通过。当C编译器编译生成一个对象的代码时，该代码是为在某一特定硬件平台运行而生成的。因此在编译过程中，编译程序通过查表将所有对符号的引用转换为特定的内存偏移量，以保证程序运行。java编译过程：java编译器却不将对变量和方法的引用编译为数值引用，也不确定程序执行过程中的内存布局，而是将些符号引用信息保留在字节码中，由解释器在运行过程中创立内存布局，然后再通过查表来确定一个方法所在的地址，这样就有效地保证了java的可移植性和安全性。如果楼主想了解JAVA编译后都做了哪些具体的事情估计要看看虚拟机的工作原理。

4. JVM中新生代和旧生代有什么区别？

　　首先，新生代，旧生代这些都是Java堆中的概念。因为涉及到垃圾回收时候的不同策略问题，故而把Heap中的内存进一步细分为新生代、老生代。一句话来描述，新生代就是新创建的对象；旧生代就是经过多次垃圾回收没有被回收的对象；

　　接下来，详细阐述一下新生代和旧生代，java内存中的堆分为两个区域，年轻区young gen和年老区old gen。就像一个社会有年轻人有年老人，为什么要这样分呢？因为Java中的对象有个特点：大多数对象在创建后，就很快没有对象使用它了；大多数一直被使用的对象很少再去引用新的对象。新生代特点：新创建的对象都放在这个区，这个区域内的JVM垃圾回收率较高，此区域内存较小。老生代特点：将新生代中生存了较长时间的对象转移过来，此区域内存较大，JVM垃圾回收的频率较低。

　　我们在项目中，使用过eclipse的肯定知道，可以通过配置两个参数来让eclipse运行起来不至于那么卡。这个叫做eclipse性能调优，通过配置eclipse.ini文件中的参数：

　　-Xmx512m(最大总堆内存，一般为物理内存的四分之一)

　　-Xms512m(初始总堆内存，常将它设置为和最大总堆内存一样大)

　　-Xmn192m(年轻带堆内存，Sun公司建议年轻代占总堆的三分之八最优)

5. 说说Java中垃圾回收的过程

　　你先这么来想。在应用程序工作的时间抽一小段时间来进行垃圾回收的。因为垃圾回收，会引起响应暂停。一句话来描述垃圾回收：当内存满了，才会去调用垃圾回收，与此同时，会调用对象的finalize()方法，来释放对象占有的资源。

码农公寓

相关文章