zoukankan      html  css  js  c++  java
  • day12

    回顾

    流程控制(语句)

    分支

    if () {
       
    }

    if () {
       
    } else {
       
    }

    if () {
       
    } else if () {
       
    } else if () {
       
    } else {
       
    }


    switch () {
      case break;
      case break;
      default:
    }

    循环

    while () {
       
    }

    do {
       
    } while()

    #适合遍历 指定次数循环
    for (var i = 0; 循环条件; 循环变化) {
       
    }

    其他语句

    continue
    break
    return

    try {
       
    } catch () {
       
    } finally {
       
    }

    'use strict'

    函数

    定义方式

    function 函数名(参数) {
       
    }

    var 函数名 = function(参数){
       
    }

    参数

    • 形参和实参

    • 参数的默认值 demo('utf-8')

    • 可变长参数 arguments

    返回值

    回调函数

    自调函数

    (function(){
       
    })()
    #作用域

    笔记

    1. JS作用域

    1.1 全局作用域和局部作用域

    • 函数外面声明的就是 全局作用域

    • 函数内是局部作用域

    • 全局变量可以直接在函数内修改和使用

    • 变量,使用var是声明,没有var是使用变量。 如果在函数内使用var来声明变量,在函数内会覆盖同名的全局变量

    1.2 变量提升

    • 在变量声明之前 去使用变量 会得到 undefined ,而不是报错 预读

    • 函数内,如果声明了跟全局变量同名的局部变量, 在声明之前使用改变量,得到undefined( 该变量已经是局部的啦)

    1.3 作用域链

    • 当一个作用域 使用某个变量时,先从本作用域中找, 如果没有去父作用域,再没有,父作用域的父作用域,一直到 全局作用域。 构成了一个作用域链

    1.4 闭包

    • 通常需要 函数中 返回一个 函数

    • 目的 把一个局部作用域的 数据 让外层的作用域使用

    1.5 ES6 新增一 块状作用域

    • let关键字也可以声明变量,同var一样

    • 但是let关键字声明的变量,会在结构语句中产生 块状作用域 同局部作用域

    • ES6建议 使用let代替 var

    2. JS对象

    2.1 构造函数和对象

    构造就是类
    function User([参数]) {
      this.属性 = 值;
      this.属性 = 值;
       
      this.方法 = function(){
           
      }
    }

    #实例一个对象
    new 构造函数();
    如果构造函数没有参数 可以 不加()
    对象.constructor 数字的话:12..constructor或者(12).constructor

    2.2 JS原型和原型链 了解

    原型

    • 每个对象 都有原型 (原型仍然是一个对象)

    • 对象可以继承原型的属性和方法

    • __proto__ 所有对象都有该属性, 该属性指向该对象的原型

    原型链

    • 原型作为对象 也有原型

    • 原型的原型的原型 就构成了 原型链

    • 使用对象中某个属性的时候,先从对象中找,如果没有,从原型上找,原型如果也没有,继续向上找,知道顶层 (顶层的原型对象是一个 类型(类)(构造函数)是Object 的对象)

    2.4 JS对象属性的调用

    .  点
    obj.name
    obj.age

    [] 中括号
    obj['name']
    obj['age']
    obj['user-name']


    任意的对象 都可以在对象实例化完成后, 添加属性和方法

    2.4 Object 构造函数

    js内建的构造方法 叫 Object
    var obj = new Object()


    josn方式定义对象
    var obj = {属性:值, 属性:值}   // new Object的简写
    obj的构造含 是 Object

    3. 实用技巧

    3.1 从页面中获取元素

    document.getElementById()   根据ID的值
    document.getElementsByTagName()   根据标签名
    document.getElmenntsByClassName() 根据class的值
    document.getElementsByName() 根据name属性的值
    document.querySelector(css选择器) 返回满足条件的第一个 元素对象
    document.querySelectorAll(css选择器)   返回所有满足条件元素组成的 类数组对象

    3.2 给元素绑定事件

    先获取元素
    ele.onclick = function(){
       
    }

    获取元素的类数组对象, 遍历,挨个给每个元素绑定事件

    3.3 修改元素的CSS样式

    ele.style.css属性名
    ele.style.background
    ele.style.border
    ele.style.backgroundColor
    ele.style['background-color']

    3.4 设置元素的class值

    ele.className 可以赋值,也可以获取
    ele.classList.add(‘值’) 添加一个class值
    ele.classList.remove(‘值’) 删除一个class值
    ele.classList.toggle(‘值’) 自动切换一个class值(有就删除,没有就添加)

    3.5 事件

    onclick         单击
    ondblclick   双击
    oncontextmenu   右击
    onmouseover/onmouseenter       鼠标悬浮到元素上
    onmouseout/onmouseleave       鼠标离开元素
    onmousemove   鼠标在上面移动
    onmousedown   鼠标的按键按下
    onmouseup     鼠标的按键抬起

    3.6 JS定时

    单次定时

    setTimeout(fn, delay)
    clearTimeout() 清除定时

    多次定时

    setInterval(fn, dealy)
    clearInterval() 清除定时

    总结

    1. 作用域

    2. 对象

    • 构造函数 实例化对象

    • 对象的原型 原型链

    3 Object 类型

    • 类似于python的字典

    • 键值对

    作页

    • 进度条效果

    • 倒计时效果 (选做) (距离世界末日还有 23天1小时4分2秒)

    •  

  • 相关阅读:
    UVALive 5983 MAGRID DP
    2015暑假训练(UVALive 5983
    poj 1426 Find The Multiple (BFS)
    poj 3126 Prime Path (BFS)
    poj 2251 Dungeon Master 3维bfs(水水)
    poj 3278 catch that cow BFS(基础水)
    poj3083 Children of the Candy Corn BFS&&DFS
    BZOJ1878: [SDOI2009]HH的项链 (离线查询+树状数组)
    洛谷P3178 [HAOI2015]树上操作(dfs序+线段树)
    洛谷P3065 [USACO12DEC]第一!First!(Trie树+拓扑排序)
  • 原文地址:https://www.cnblogs.com/xujinjin18/p/9457137.html
Copyright © 2011-2022 走看看