js第二周笔记

184 阅读6分钟

一、数据类型的转换(补充): 转bool:Boolean(x);//一般不用 有6个会转为false:0,"",undefined,null,NaN,false,其余都是true

二、运算符和表达式(补充)

1、比较运算:> < >= <= == != === !==
	特殊:默认都转为数字,再比较
		1、两边都是字符串,按位PK每个字符串unicode
			0-9 A-Z a-z 汉字

		2、NaN:!isNaN(x)

		3、undefined===null

3、逻辑运算:
	特殊:短路逻辑
	&&:简化if
	条件&&(操作);
            ||:两个值二选一 - 以后兼容
	e=e||window.event;
4、位运算:
	左移:m<<n,m*2的n次方
	右移:m>>n,m/2的n次方

5、赋值运算:+= -= *= /= %= ++ --
	i-- => i-=1 => i=i-1;

	特殊点:
		前-- 和 后--
		单独使用时,放前放后无所谓
		如果参与了别的表达式:变量中的值都会-1
			前--,返回的减了之后的新值
			后--,返回的减了之前的旧值

6、三目运算:简化if...else 和 if...else if...else
	条件?操作:默认操作;

	条件1?操作1:条件2?操作2:默认操作;

	特殊点:1、操作只能有一句话
		2、默认操作不能省略的

  1、舍入误差:parseFloat(num.toFixed(保留小数位数));

  2、获取字符串中第一个字的ASCII码:var ascii=str.charCodeAt(0);
  1、自定义函数:方法,一段提前被定义好的,可以反复使用的代码段

三、函数如何使用:2步 1、创建/定义/声明函数&返回结果:2种

            1、*声明方式:
	        function 函数名(形参,...){
			   函数体
			   return 返回值;
	        }

	2、直接量方式:
		var 函数名=function(形参,...){
			   函数体
			   return 返回值;
	        }函数名=变量名		
		
2、调用函数&接住结果
	var result=函数名(实参,...);

   解释:return:本意退出函数,但是如果后面跟着一个数据,则可以将数据返回到全局作用域中,但是仅负责返回,不负责保存,所以我们需要自己创建一个变量接住函数调用的结果
		 return只能写一次,而且最好写在函数体的后面
	 何时使用:并不是任何时候都需要加return1、全局想要使用局部的
			2、调用完函数还希望拿到函数的结果在后续还要做操作时
			3、如果没有return,其实也有默认返回值undefined
	

四、作用域:2个

    1、全局作用域:全局变量 和 全局函数,在任何位置都可以访问/使用
2、函数/局部作用域:局部变量 和 局部函数,只能在当前【函数调用时内部可用】
有了作用域才有变量的使用规则:
	优先使用自己的,自己没有找全局,全局都没有报错
强烈建议:千万不要对未声明的变量直接赋值,导致全局污染
	     所有的变量在使用之前都一定要先var,不能对着没有var变量直接赋值
     哪些属于局部变量:2部分
	1、直接在函数作用域中创建的变量
	2、形参

全局无法使用局部的,因为不符合现实生活
解决:创建函数部分

五、声明提前

    在程序执行之前
悄悄将var声明的变量和function【声明】的函数
集中提前到当前作用域的顶部
但是赋值留在原地
变量比函数更轻

我们程序员是看不见的,但是会悄悄执行的

如果在笔试题中看到先试用后创建,多半都是考你声明提前

六、按值传递:两个变量之间进行赋值

    1、如果传递的是原始类型的值:两个变量之间赋值,做操作,互不影响的 - 其实是复制了一个副本给对方
    2、如果传递的是引用类型的对象:ArrayFunction
两个变量之间赋值,做操作,是会相互影响的 - 因为两个用的是同一个地址值

2、预定义的全局函数:前辈们(实现浏览器的程序员们)提前定义好,我们可以直接在任何位置使用的函数:

    1、编码和解码:
   问题1:url网址中不允许出现多字节字符,如果出现会导致乱码
		utf-8编码格式下,一个汉字占3字节
   解决:前端工程师需要将用户输入的网址中的中文编码为单字节字符,后端工程师接住前端传来的东西解码为原文
        编码:var code=encodeURIComponent("str");
        解码:var 原文=decodeURIComponent(code);


2isFinite(num):判断num是不是在有效范围之内
	三种情况会为false:分母为0,NaN,Infinity

3、重要的:parseInt/Float()、eval()、isNaN()

七、分支结构:根据条件的不同,执行不同的操作

    if...else结构
switch...case结构
语法:
  switch(变量/表达式){
	case1:
	操作1;
	break;
	case2:
	操作2;
	break;
	default:
	默认操作;
  }

注意:默认只要满足一条路,会把后面所有的操作全都做完,解决:break:一般放在操作的后面,但是:
    1、最后default不需要加break
    2、如果连续的多个操作是一样的效果,也可以省略中间部分
2、不带有隐式转换
3default可以省略不写

if vs switchswitch:优点:效率相对较高,因为不需要做任何范围判断
	        缺点:不能实现范围判断,必须要知道用户有可能输入的结果是什么才能使用
  if:优点:实现范围判断
      缺点:效率相对较低

1、JS动画:跟JS没关系,有JS来触发,JS设置CSS是瞬间的操作,只需要在CSS中加一个过渡就可以具有动画了 八、循环:

       var 变量=几;
       do{
            循环体;
            变量变化
       }while(循环条件)

       不管第一次满不满足,都会执行第一次

       终止循环语句:continue - 退出当前次循环

九、数组的基础:

     关联hash数组:下标是可以自定义的
创建:var arr=[];
      arr["自定义下标"]=值;

访问:arr["自定义下标"]

特殊:遍历:for in循环
	for(var i in arr){
		i;//当前次的下标
		arr[i];//当前次的元素
	}

十、数组的API:

           1、数组转为字符串:var str=arr.join("自定义连接符");
                        固定套路:1、无缝拼接
                                  2、拼接页面上的元素

           2、拼接数组:添加元素的新方式
                var newArr=arr.concat(值1,arr2,...);

           3、截取子数组:拿出某一部分
                var subArr=arr.slice(starti,endi+1);

           4、删除、插入、替换:
                var deletes=arr.splice(starti,n,值1,....);

           5、翻转数组:arr.reverse();

十一、Array API:

1、排序:arr.sort() 
   按数字排序:arr.sort(function(a,b){return a-b})
   降序排序:arr.sort(function(a,b){return b-a})

2、栈和队列:
	arr.unshift(值,...);
	var first=arr.shift();

	arr.push(值,...);
	var last=arr.pop();

十二、二维数组:

     创建:
  var arr=[[],[],[],[]]
访问:arr[r][c];
特殊:列下标越界:undefined
      行下标越界:报错
遍历:
	for(var r=0;r<arr.length;r++){
		for(var c=0;c<arr[r].length;c++){
			arr[r][c];//当前次元素
		}
	}

十三、字符数组:字符串的任何API都不会修改原字符串,保存新字符串

   1、String API:
1、转字符串:\
	作用:3个
	  1、字符串中如果出现了和字符串冲突的符号,可用\将其转义为原文
		\"	\'

	  2、特殊功能:
		换行:\n
		制表符:\t

	  3、*可以书写unicode号 表示一个字
		\uXXXX
		汉字的第一个字:4e00
		汉字的最后一个字:9fa5

2、转换大小写:【统一的】转为大写或小写,再比较,忽略大小写:
	大写:var newStr=str.toUpperCase();
	小写:var newStr=str.toLowerCase();

3、获取字符串中指定位置的字符的ascii码
	var ascii=str.charCodeAt(i);

   通过ascii码转回原文
	var 原文=String.fromCharCode(ascii);

4、检索字符串:检查索引/下标:从starti位置开始找右侧的第一个关键字的下标
	作用:判断有没有
	var i=str/arr.indexOf("关键字",starti);
	特殊:1、starti可以省略,如果省略则从0开始
	      2、返回值:找到了,返回第一个字符的下标
没找到,返回-1,其实我们根本不关心下标是几,只关心下标是不是-1,-1代表没找到,不是-1代表找到了
	      3、数组也可以使用此方法
	      
5、拼接字符串:var newStr=str.concat(str1,str2...) 还不如 +运算

6、截取字符串:
	1、var subStr=str/arr.slice(starti,endi+1);
	2、var subStr=str.substring(starti,endi+1);//不支持负数参数
	3、var subStr=str.substr(starti,n);//n=个数,不用考虑头尾问题

7、替换字符串:
	var newStr=str.replace("关键字"/正则表达式,"新内容");

    8、切割/分割字符串:作用:str <=> arr
	var arr=str.split("自定义切割符");
	特殊:
	1、切割符可以自定义,切割过后返回一个数组,数组中不再包含切割符
	2、如果传入的切割符是一个"",每一个字符都会被切开

十四、创建元素并且渲染页面

    1、创建空标签
    var elem=document.createElement("标签名");
2、设置必要的属性或事件
	elem.属性名="属性值";
	elem.on事件名=function(){函数体} - 事件都可以在创建时提前绑定上

3、创建好的元素渲染到DOM树上
	父元素.appendChild(elem);