zoukankan      html  css  js  c++  java
  • JavaScript学习(一)

    1、引入Script文件,一般放到head标签内即可

    <script src="./JS/learn.js">
    </script>
    

    路径问题:

    ./表示当前路径;

    /表示根目录;

    ../表示上一级目录;

    如果不加/,如<script src="JS/learn.js">的形式,也表示的是当前目录(所以要注意咯!);

    2、调试

    使用console.log()进行控制台的信息输出,在source中加断点调试,和vs调试一样;

    3.类型

    3.1  js是弱类型语言,使用var关键字声明,如果想知道当前操作的变量是什么类型,使用typeof关键字;typeof num即可(注意,typeof是个关键字,不是函数)。

    3.2  如果一个变量未进行赋值,那么log它的值就是undefined

        注意:undefined和null不一样

    3.3 注意NaN表示的不是一个数字,但是它是数字类型

    4.字符

      JS中字符由""和''包裹,这两个符号表示的意思相同,之所以有两种,是方便句内引号不需要额外加转义,句内单引号,那么外包双引号,反之同理。如果句内又有单引号,也有双引号,那么加额外转义字符 即可。

     5.文档注释

    单行和多行注释同c#

    文档注释使用,按下/**回车即可,一般的编译器会自动补充完整

    /**

    *

    */

    6.类型转换

    parseInt()这个是从第一个字符转换成数字第一个碰到的不是数字的字符截止,返回输出结果,如果从第一个字符开始就不是数字,直接返回NaN;

    7.比较运算符  ===

    表示全等于,同时判断数值和数据类型,==只判断数值,所以注意"12"==12返回的是true

    8.循环结构

    switch中的break是可以省略的,与C#是不一样的。

    9.数组

    在JS中,数组是集合、队列、栈的综合体,因为可以承载各种类型的数据。

    所以你可以看到这样的数组:

    var arr2 = [1,'lee',[1,2,3],function a(){alert('Hi')}];
    console.log(arr2[3]());
    console.log((arr2[2]))
    

    甚至放进去一个函数,然后执行。

    很神奇的操作。

    for in 循环  

    输出数组的下标

    还可以输出对象的属性名;

    10.函数

    函数由关键字function声明,注意函数没有返回值,因为本身就是一个var类型,有返回值直接接收就可以了,不需要显示声明。

    函数的形参声明也不需要写var关键字,直接写变量名即可。

    注意:

    函数的声明位置不影响其调用;

    原因:

    所有声明的函数都属于window对象,JS有一个优先级会优先声明,所以调用和位置无关,但是这样的坏处是可能替换window对象的其他函数。

    注意:

    函数可以返回函数,返回值是function类型。

    函数名+()直接调用函数。

    类似于C#中的委托,使用一个变量表示函数

    function demo()
    {
    	return function (){console.log("It's demo inside!")};
    }
    var de = demo();
    de();
    

    匿名函数(上部代码)

    函数的lambda表达式

    function demo(func)
    {
    	if(func)
    	{
    		func();
    	}
    }
    function hello()
    {
    	console.log("This is Hello!");
    }
    demo(hello());//函数作为参数传递
    demo(()=>console.log("lambda"));//lambda表达式
    

    自调用函数/闭包

    (function demo(num){console.log("This is "+num)})(2);
    

    自调用函数就是让函数自己执行一次;

    说明:第一个包围住函数声明的括号()表示声明函数体,紧接着后面的()表示调用函数,如果有参数,直接写在括号内。

    注意:闭包的好处或者优势是什么?

    答: 对于JS来说,全局变量自动添加进了window中,那么带来的负面影响就是会污染window内部本身的属性,结合下一节 作用域 的内容,你可以看到,声明在函数内的变量是局部变量,这样就不会影响到window或者是函数外的其他变量或者方法了!

    11.作用域

    只有在function内部声明的变量才是局部变量,除此之外的变量都是全局变量,自动添加进window对象中。  

     注意:

    预解析过程:声明优先但是赋值不会优先;

    console.log(a);
    var a=12;
    

    现象:控制台输出undefined。

    原因:JS的优先级机制会将所有的声明放到程序最优先执行的位置,所以只要声明了就不会报错,但是赋值并不会提升到同样的优先级,而是保留到原位。

    同样的;

    预解析过程适用于函数的声明。

    如果同时声明了同名的方法和变量:

    注意:方法是覆盖对象的,可以这么理解,预解析器将声明和方法都提到了最优先级,但是声明是被提到了最上层,而方法是被放置在下一行位置。

    12.对象

    json对象/字面量对象

    是属于一次性对象,主要用来传递信息的。

    var stu = {
    	id:1,
    	name:"zhangsan",
    	show:function (){
    		console.log("This is json!");
    	}
    }
    stu.show();
    

    注意代码写法:

    对象使用{}大括号包裹起来;

    属性名和属性值之间使用:分隔;

    不同的属性名使用,逗号隔开

    第二种声明对象的写法

    var stu = new Object();
    stu.id=1;
    stu.name = "lisi";
    stu.show = function(){
    	console.log("name "+ this.name + " id "+this.id);
    }
    stu.show();
    

    注意,在声明show方法中,如果要使用stu的name,那么必须要加this.调用属性。

    这其中描述了 . 的两种作用中的第二种;

    ①调用

    ②定义

    注意this的使用问题;

    在上一个代码中,this指向的stu

    function demo(){
    	console.log(this);
    }
    

    而在这个代码中,this指向的是window。

    为什么?

    这是因为声明的demo函数会自动添加到window对象中,所以this就变成了window。

    构造函数创建对象

    (function(){
    	function Student(id,name,age)
    	{
    		this.id = id;
    		this.name = name;
    		this.age = age;
    		this.show = function(){
    			console.log("年龄"+this.age+" Id "+this.id+" 名字 "+ this.name);
    		}
    	}
    	var stu = new Student(1,"zhangsan",12);
    	stu.show();
    	
    	var stu1 = new Student(2,"lisi",22);
    	stu1.show();
    	
    	for (let var1 in stu) {
    		console.log(typeof stu[var1]);
    		if((typeof stu[var1])!="function"){
    			console.log(var1+":"+stu[var1]);
    		}
    	}
    })();
    

    这里用function建立了Student的构造函数,可以直接new出对象;

    然后使用for in 循环打印出了不属于函数的对象的所有属性。

    13.常用函数

    查询mdn,东西比w3c更全,更专业!

  • 相关阅读:
    thinkphp ajax分页加载更多最简单的实现方法
    thinkphp整合系列之phpexcel导入excel数据
    Nginx详细安装部署教程
    swoole 安装方法
    tpshop使用中遇到的问题
    Oracle 的分页查询 SQL 语句
    使用 PLSQL 提示动态执行表不可访问,本会话的自动统计被禁止
    JavaScript实现多张图片上传功能
    JavaScript控制页码的显示与隐藏
    Struts2 项目 Action 查询结果异常 org.apache.struts2.json.JSONException
  • 原文地址:https://www.cnblogs.com/LeeSki/p/11619700.html
Copyright © 2011-2022 走看看