Javascript笔记

2019-04-02

1. var、let、const区别

var 定义的变量可以穿透块作用域访问，if和for可以穿透，var但不能跨函数作用域访问
let 定义的变量，只能在块作用域里访问，不能跨’{}’引用，也不能跨函数访问
const 定义常量，赋值，常量不可变。

2. (function(){函数体})();

自引用的函数,不用调用便可以运行

3.关于JQuery ajax请求一直返回Error(parsererror)问题

问题出在请求的类型上，如果参数DataType设置为JSON,然而服务器端并不是返回json数据，就出现解析错误。若无用需要将该参数注释掉便可。
4、for in 和 for of区别

for in 是遍历数组的索引，for of 是遍历数组的元素。

// for of 遍历元素
let sum = (...m)=>{
    let total = 0;
    for(let i of m){
        console.log(`i:${i}`);
        total += i;
    }
    console.log(`total:${total}`);
}
sum(1,2,3,4); // 10

// for in 遍历索引
let sum2 =(...m)=>{
    let total=0;
    for(let i in m)
    {   // 索引 0 1 2 3
        total += i;
    }
    console.log(`total:${total}`);
}
sum2(1,2,3,4); //00123

结果显示for of 是元素，for each是遍历索引。
5.异步请求的同步请求
很多时候，异步请求是不错。但是，在特殊的逻辑处理，异步的请求是会影响程序的处理逻辑的。在大创的项目中，判断是否喜欢的逻辑，使用同步请求的逻辑，影响程序的执行顺序.
6、javascript对象问题

6.1 关于原型链的问题：prototype
设置一个实例的原型链使用的语句是objectInstance.__proto__=Parent
将这个实例的原型链指向Parent类。这样做有什么好处？经过原型链继承之后，这个实例就可以调用Parent的方法了。
6.2 普通函数和构造函数。
如果使用new，返回一个对象。不使用new就简简单单的只是一个函数。

7、使用jquery发送json数据

function insertInform(informTitle,informBody){
    var insertInformUrl = informBaseUrl + "/insertInform";
    var re = false;
    var formData = {
        "informTitle": informTitle,
        "informBody": informBody
    }
    $.ajax({
        url:insertInformUrl,
        async: false,
        dataType: 'text',
        type: 'post',
        processData: false,
        contentType: "application/json",
        data: JSON.stringify(formData),
        success:function (data) {
            if(data === 'success'){
                re = true;
            }
        },
        error:function (xhr, type, error) {
            console.log(type+"error:"+error)
        }
    })
    return re;
}

8、获得跳转页面的hash

1	window.location.hash.split("#")[1];

9、前端打包数据下载

function download(filename,content,contetnType){
  if(!contetnType){
    contetnType = "application/octet-stream";
  }
  var a = document.createElement('a');
  var blob = new Blob([content],{'type':contetnType});
  a.href = window.URL.createObjectURL(blob);
  a.download = filename
  a.click();

其中的content是随意的。文件名也是随意的

10、前端读取文件的base64码

if(!window.FileReader)
{
    alert("不支持文件读取");
}else{
    // 读取到的文件
    var file1 = fileinput.files[0];
    // 文件名
    filename = file1.name;
    // 文件读取器
    var filereader1 = new FileReader();
    filereader1.readAsDataURL(file1);
    
    filereader1.onabort = function(){
        alert("文件读取中断！")
    }
    filereader1.onerror = function(){
        alert("读取文件错误")
    }
    filereader1.onloadend = function(e){
        // 文件的base64码，一串字符串
        fileStringBase64 = e.target.result;
        // code 读取文件完成后的操作
    }
}

获得某个元素的自定义属性

有如下元素:

<div id="bgImgProgLoad" data-ultra-definition-src="/th?id=OHR.TulpenMiesbach_ZH-CN8593652929_UHD.jpg&amp;rf=LaDigue_UHD.jpg&amp;pid=hp&amp;w=1920&amp;h=1080&amp;rs=1&amp;c=4" data-explicit-bing-load="false" data-dynamic-size="true"></div>

取出其中图片的地址data-ultra-definition-src,

1	var bgurl =document.querySelectorAll("#bgImgProgLoad")[0].getAttribute("data-ultra-definition-src");

let声明变量

跟var用法一致,let作用域只在代码块中。

{
let a = 10
var b = 20
}
console.log(a)
console.log(b)

错误：Uncaught ReferenceError: a is not defined
var作用域引发的问题。

var a = [];
for(var i = 0;i < 10;i ++) {
    a[i] = function() {
        console.log(i);
    };
}
a[6](); // output 10

为什么输出的是10？因为i的最终值是10。
使用let

var a = [];
for(let i = 0;i < 10;i ++) {
    a[i] = function() {
        console.log(i);
    }
}
a[6](); //output 6

for循环的作用域问题,设置循环变量是父作用域，循环体是另外一个子作用域

for(let i = 0;i < 3;i ++) {
    let i = "hello";
    console.log(i);
}
//output:
// hello
// hello
// hello

let不存在变量提升,必须是先声明,然后才能使用。var的变量提升,可以在使用之后声明变量。

1 2	console.log(foo); var foo = 2;