zoukankan      html  css  js  c++  java
  • JavaScript学习笔记

    第一章:认识Java script
    JS是什么?
    1、JS是一门脚本语言;
    2、JS是一门解释性的语言
    3、JS是一门动态类型的语言
    4、JS是一门基于对象的语言
    JS包括:
    1、ECMAScript 基本的语法标准
    2、BOM:浏览器语法标准
    3、DCM:文本语法标准
    JS可以加在网页中的任何地方 head中 body中  或者HTML之外都可以
    用法:在按钮中添加onclick=“方法()”(单击事件)
    在<script>中利用function激活单击事件(用空格隔开),后面加{  }
    alert 弹窗:alert(“输出内容”)  遇到双引号时将里面的改为单引号
    双引号中的内容是输出内容   可以随意改变
    注释方法:单行注释:  //
              多行注释:=CSS注释方法( /*注释内容*/ )
              快捷键:Ctrl + /
    JS代码的特
    1、Java Script 脚本程序在HTML中执行;
    2、Java Script 区分大小写;
    3、文本内容要放在英文双引号之中;
    4、语句末尾要加分号(;)代表这一行语句(代码)的结束。
    JS的作用:
    A、设计页面效果
    B、动态改变页面内容
    C、操控HTML和CSS
    D、表单验证
    document.write(“”)在页面上输出双引号(英文双引号)内的内容
    第二章:变量运算符
    document.getElementById(“值”):通过id获取value的值
    JS中加号(+)的作用 :
    1、连接符 用于连接两个变量
    2、运算符号(一直理解的那个意思)
    变量:
    定义:用来承载数值、文字、true、false的称之为变量
    用法:
    第一种:1、定义一个变量   
    3、声明变量 var 变量的名字(英文的)= 值 ;
    4、赋值:写什么是什么。
    第二种:直接声明变量  var  name ;  然后赋值:name = “值”;(用的比较少)
    *定义变量名称时应该注意的规则:
    1、变量名要做到见名知意,可以采用英文单词或者中文的首字母缩写(变量方法命名,第一个单词首字母小写其他单词的首字母大写,这就是驼峰命名法)
    2、变量名的首字符必须是英文字母、下划线或美元符号中的一种。
    3、变量名中不能有空格
    4、变量名要避开Java Script 中的保留字(if  else  function  switch  start  for 等)
    布尔数:布尔类型只有两个取值,true和false。期中true表示真、false表示假。
    在js中,通过var前缀表示要定义一个变量,当我们要给其赋值时变量的类型才最终确定下来,常见的类型有:
    1、undefined:当定义了变量而未赋值时,其类型时undefined。
    2、null:空类型,类似于undefined。
    3、number:数值类型,含整数和浮点数(小数)。
    4、String:字符串。
    5、type of:获取变量的值。
    6、NaN:非数值,是number中一个特殊的值。
    String 转 number:
       String(字符串),是编程语言中最常见的数据类型,每一个HTML元素的 属性值 都是String 类型的,但是某些计算只有number才可以,因而要将String类型的值转化为number类型的值,就是一个非常普遍和重要的操作,JS中提供的方法是:
    1、parseInt:将字符串转化为整数(number);
    2、ParseFloat:将字符串转化为浮点数(小数);
    *如果非数字开头,转化结果为NaN
    如果是数字开头,碰到非数字时结束转换
    运算符:
    JavaScript 算数运算符:
    7
    JavaScript 赋值运算符:
    JavaScript 比较运算符:
    JavaScript 逻辑运算符:
    注意:常量和变量之间必须要有“+”链接
    第三章:分支结构
    往div中输入内容:.innerHTML
    分支结构:
    1、if(条件表达式) {  语句  }
    2、If-else 结构   A、else结构放在if的下边和if 搭配使用;
    B、if 和 else下边用大括号表达一个管辖范围,这时是不能像普通语句那样在最后加分号
    3、多重if 和嵌套if-else结构:有多个分支控制变量,并且分支变量之间有递进关系的要使用嵌套的分支结构
    4、switch结构:记得一定要加break跳出循环
    运行规则:先匹配(只一次)后贯穿执行,遇到直行break才跳出。case内部可以嵌套 if-else结构,甚至是另一个switch结构,
    Math.pow(x,y)表示x的y次方
    第四章:循环结构1
    JS中提供了一个prompt功能块,他会弹出一个小窗口,这个窗口中有一个提示信息,和一个输入框,可以利用这个功能,获取用户的输入。
    循环结构:
    循环就是当满足一定条件时,能重复不断执行的一组代码,不满足条件时,循环结构会被打破或终止。
    循环的类型:递推法、穷举法、菜单模式、行列模式、迫近法等
    实现循环的三中语法:while 、 do-while 、for
    while结构:擅长做条件不确定(可能是死循环)
    do-while结构:擅长做先执行后判断类型的
    for结构:擅长做次数固定的
     
    while(循环条件(如果最终执行结果为true和false,满足条件为true反之则为false)){ 循环体/循环操作 } 如果循环条件是true就是死循环、如果循环条件是false就是永远不会执行的循环
    重点 1、计数器 (var)
    2、判断条件【while()】
    3、i++ 累加或累减
    递推:
    关于递推:正向递推知道初始值,逆向递推知道最终值
    递推的核心:就是找到相邻的两次循环之间的关系,并运用相应运算表达这种关系
    如何调试代码:1、点击F12快捷键,进入调试后,在合适的位置插入断点
    2、单步执行(F10或F11快捷键),观察变量的值。
    3、发现问题,思考如何修改代码、
    4、成功解决问题
    第五章:循环结构2
    do-whlie循环:do{ 循环操作 }while(循环条件);
    首先执行do区域中的循环操作,然后进行循环条件的判定,如果是true则再次执行do区域中的循环操作,以此类推,如果为false则结束循环 最后的那个分号在while中不可以这样写
    do-while与while的区别:
    while:如果判断没有通过,就一次都不会执行(先判断,后执行)
    do-while:如果判断没有通过,也会执行一次(先执行,后判断)
    for循环:for([初始变量];循环条件;[修改变量]})
    { 循环操作 }
    for循环的执行过程:
    1、如果一个for循环总共循环了n次,则初始变量(表达式1)只会执行一次,循环条件(表达式2)执行了n+1次,修改变量(表达式3)执行n次
    2、修改变量(表达式3)使用i++会比较多,但也并非总是这样。
    3、如果continue用在for循环中并被执行,会先跳到表达式3,然后再进入表达式判定,切记!
    循环嵌套:
    1. break 关键字可以跳出其当前正在执行的循环(仅仅一层),但不能跳出外层循环。
    2. 每一种循环结构内部也可以嵌套其他循环结构。
    3. 循环嵌套的层数没有限制。
    4. 只要是组合类题目,大都是循环嵌套。
    HTML中空格有多重格式:
    名称
    编号
    描述
    &nbsp;
    &#160;
    不断行的空白(1个字符宽度)
    &ensp;
    &#8194;
    半个空白(1个字符宽度)
    &emsp;
    &#8195;
    一个空白(2个字符宽度)
    &thinsp;
    &#8201;
    窄空白(小于1个字符宽度)
    第六章:使用方法重构任务
    1、功能块:   
    定义:在JvaSript中,使用function关键字来定义功能块(js语言中,把功能块称之为“方法”和“函数”)
    基本语法:function 方法名称(参数1,参数2……参数n){
         *参数之间用英文逗号隔开
          语句
       return表达式(如果当前方法没有返回值则可以去掉return
    好处:可以提高代码的复用率
    2、有参方法:
    (1)关于无参:
    无参代码的三个组成:1、输出过程:从输入框中获取数据;
                        2、处理过程:定义的数据处理方法;
                        3、输出过程:alert(弹窗)、document.write(页面输出)、console.log(控制台输出)
    (2)关于有参:
    当处理过程需要在好多的地方调用时,我们就可以利用无参把它单独实现一个功能块。(在定义是的参数叫做形参,调用时输入的参数叫实参)
    基本用法:function 方法名(参数1,参数2){
                 语句;
     
    }alert(参数1,参数2);
    3、随机数:
    基本用法:
     
    4、变量作用域:
    小结:在学习完方法后,我们将变量的定义位置总结如下:
    1、 定义在<script>下边;
    2、 定义在分支结构当中;
    3、 定义在循环结构中;
    4、 定义在方法中;
    分类(个人):
    1、 局部变量:(尽量往上面写)制作用于某一个部分的变量,一般出现在方法内;
    2、 全局变量:可以整个代码都可以调用的变量;
     
    第七章:指导学习
    1、关于JavaScript
      组成:总体来说包括:
    1、 核心语法:类型、变量、表达式、分支、循环、函数、事件、对象等;
    2、 浏览器对象模型(BOM):操作浏览器对象:
    3、文档对象模型(DOM):操作页面内容对象:
    4、使用方式:类似于CSS,也是分为行内式,内部式,外部式
    5、运算符:
    1、 数学运算符:+、-、*、/、%、++、--
    2、比较运算符:<、>、>=、<=、==、!=
    3、 逻辑运算符:!、&&、||
    6、 递归:
    1. 退出条件:必须在内心里知道每一个递归都是以一种环路的方式在执行,如果不能退出,最终就会成为一种真正的死循环。(f1和f2的值是固定的1,到这儿就可以回退了)
    2. 工作代码:真正在工作的代码。 (这里是getFab(n-1)+getFab(n-2))
    3. 环路调用:自己调用自己,形成环路;A中调用B,B中又调用A形成环路等。(在函数执行过程中调用了自身形成环路)
    7、事件类型:
    窗口(window)常用事件  
    名称
    触发时机
    onload
    当前的html内容都已经加载成功后触发。
    onscroll
    当发生页面滚动时触发(用户点击滚动条或滚动鼠标滑轮)。
    onunload
    用户离开页面时触发。
    onfocus
    获得焦点时触发。
    onblur
    失去焦点时触发。
    onclick
    被点击时触发。
    html元素常用事件
    名称
    触发时机
    onchange
    内容或选项发生改变时。
    onkeydown
    键盘按下某键时(例如:在文本框中按下某键)。
    onkeyup
    按键抬起时触发。
    onkeypress
    只要按键就触发。
    onfocus
    元素获得焦点时触发。
    onblur
    元素失去焦点时触发。
    onclick
    元素被点击时触发。
    ondbclick
    双击元素时触发。
    onmouseover
    鼠标移到元素上时触发。
    onmouseout
    鼠标移出元素时触发。
    onmousemove
    鼠标在元素上 移动时触发。
    第八章:类与对象
    1、站在js的层次而言,对象由两个要素组成,分别是属性和方法。
    属性:事物本身所固有的性质。是物质必然的、基本的、不可分离的特性,又是事物某个方面质的表现。事物常表现出多种属性。
    方法:一般是指为获得某种东西或达到某种目的而采取的手段与行为方式。
    2、关于类:
    通常,我们把具有相同属性和方法的对象归为一类。类就是现实世界或思维世界中的实体在计算机中的反映,它将数据以及这些数据上的操作封装在一起。那么,类是对一种事物的抽象概念。
    3、对象与类的关系:
    类与对象的关系就如模具和铸件的关系,类是抽象的概念,仅仅是模板,对象是一个具体实体。对象和类有“是一个”的关系。
    4、
    此图中:带括号的是方法,不带括号的是属性。
    document.title是页面的标题
    5、自定义类:
    如图所示,要实现一个自定义类有几个关键字需要注意:
    1、class:用于声明定义类,是ECMAScript 6的一个语法糖。
    2、constructor:构造方法又称构造器,构造方法是类的默认方法,通过new命令生成对象实例时,自动调用该方法。一个类必须有构造方法,如果没有显式定义,一个空的隐式的构造方法会被默认添加。
    3、this:在方法中默认指向当前对象,在构造方法中,使用this打点可以直接定义属性。大家注意,类像个模子,是不能执行的,当代码执行到this时,自身这个对象被创建并正被执行。
    6、自定义类的方法:
    注意:
    1、类名建议为名词;
    2、属性名要符合js变量定义的习惯;
    3、方法名使用动词或动词+名词;
    4、1个类中,可以定义多个方法。
    7、JSON:
    定义:JSON即JavaScript Object Notation,是JavaScript对象原生的一种表示形式。它和字符串之间可以快速转换,json格式的字符串,是一种轻量级的、纯文本的,用来存储、传递和交换的文本信息,类似于XML,但是比XML更小、更快、更容易解析。
    基本语法:
    属性值可以是:数字(整数或者浮点数)、字符串(必须放在双引号中)、布尔值(true和flost)、null。
    8、总结:
    1、使用关键字class来定义类,类名一般为名词首字母大写;
    2、类中有构造方法,和普通方法,可以使用this关键字来定义属性;
    3、构造方法使用constructor关键字。
    4、通过new来创建对象。var h1 = new Human("Jim",20);
    5、代码 var h1 = new Human("Jim",20); var h2 = h1,h3=h1;请问这3行代码创建了几个对象?
    6、我们之前章节经常用到的 打点调方法,其实都是对象打点调方法;

  • 相关阅读:
    深入nginx之《获取用户的真实IP》
    深入Nginx之《常用参数配置技巧》
    深入Nginx之《HTTP请求报文与HTTP响应报文》
    webapck html-loader 静态html模块化
    webpack四个基础概念
    从原生Android 跳转到hbuilder项目
    移动端适配方案 flexible.js
    vue使用px2rem
    koa2 post请求ctx.request.body空获取不到的解决办法
    url、href、src
  • 原文地址:https://www.cnblogs.com/snyv-nice/p/13790241.html
Copyright © 2011-2022 走看看