学习笔记之JavaScript

1. 数组转换成json格式

list= ['zhangsan','lisi','wangwu']//转换前
newList = [{student:'zhangsan'},{student:'lisi'},{student:'wangwu'}]//转换后
//js
for(i = 0; i<list.length;i++){
	obj = {student:list[i]}
	newList.push(obj)
}

2.自动生成从0到9的数组

var arr1 = new Array(10);
for(var i=0;i<arr1.length;i++){
  arr1[i] = i;
}
console.log(arr1);//[ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

3.自动生成Json列表

var list_map = new Array();
for ( var i = 0; i < 10; i++) {
  list_map.push({baidux:'baidux'+i,baiduy:'baiduy'+i});
}
console.log(list_map);
/*[ { baidux: 'baidux0', baiduy: 'baiduy0' },
  { baidux: 'baidux1', baiduy: 'baiduy1' },
  { baidux: 'baidux2', baiduy: 'baiduy2' },
  { baidux: 'baidux3', baiduy: 'baiduy3' },
  { baidux: 'baidux4', baiduy: 'baiduy4' },
  { baidux: 'baidux5', baiduy: 'baiduy5' },
  { baidux: 'baidux6', baiduy: 'baiduy6' },
  { baidux: 'baidux7', baiduy: 'baiduy7' },
  { baidux: 'baidux8', baiduy: 'baiduy8' },
  { baidux: 'baidux9', baiduy: 'baiduy9' } ]*/

-----------------分割线（2020.04.08）----------------------------

4.JavaScript菜鸟教程学习笔记

1. js几种显示数据的方法（可以用于debug）:
   alert()-弹出警告框；
   document.write()-将内容写到html中；
   innerHTML-写入到HTML元素；修改元素前使用document.getElementById(“demo”)通过id属性来查找对应的元素;
   console.log()-写入到浏览器的控制台；
2. 变量必须以字母开头，重新声明变量没赋值，变量值不改变。
3. 基本数据类型：String、Number、Boolean、null、Undefined、Symbol（ES6引入）
   引用数据类型：Object、Array、Function
4. 局部变量与全局变量：
   局部变量：在函数内部使用var声明的变量是局部变量，局部变量会在函数运行以后被删除。
   全局变量：在函数外部声明的变量是全局变量，全局变量会在网页关闭后被删除。
5. break-直接调出；continue-当前调出后继续执行。
6. 使用严格模式的优点：
   消除代码运行的不安全之处，保证代码运行的安全；
   提高编译器效率，增加运行速度；
7. this-表示当前对象的引用
8. var声明的变量不具备块作用域，在{}外也可以访问；
   let声明的变量只能在let命令所在的代码块
9. JSON是用于存储和传输数据的格式；
   JSON语法规则：数据为键值对，数据由逗号隔开，打跨号保存对象，方跨号保存数组。
   JSON.parse()-用于将一个json字符串转换为JavaScript对象；
   JSON.stringify()-用于将JavaScript值转换为JSON字符串。
10. void()-该操作符指定要计算一个表达式但是不返回值。
11. call()-该方法进行调用函数时：第一个参数必须是对象本身，其他参数以参数形式传入；
    apply()-该方法进行调用函数时：第一个参数必须是对象本身，其他参数以数组的形式传入。
12. 操作HTML元素的三种方法：
    通过id-document.getElementById(“id_name”);
    通过标签-document.getElementByTagName(“tag_name”);
    通过class-document.getElementByClassName(“class_name”);
13. 操作HTML DOM
    如何改变HTML元素的内容（innerHTML）和属性-内容：document.getElementById(“id_name”).innerHTML=“hello,world!”;属性:document.getElementById(“id_name”).width = “600”;
    如何改变HTML元素的样式（css）-document.getElementById(id_name).style.color=“red”;
    如何对HTML DOM事件做出反应-点击事件：onclick；进入和离开页面事件：onload、onunload；离开输入框事件：onchange；鼠标移进和移出事件：onmouseover、onmouseout；点击鼠标时、释放鼠标时和完成鼠标点击事件：onmousedown、onmouseup、onclick；
    如何添加或删除HTML元素

-----------------分割线（2021.01.05）----------------------------

5.条件语句与&&的转换

说明：红色框的写法等同于绿色框上注释代码的写法