js日志

Javascript学习日志

Writen By CoolGhost,Started With 2016/10

  • 访问JS属性的两种方式
    person.lastName person["lastName"]
  • 如果把值赋给尚未声明的变量，该变量将被自动作为全局变量声明
    • 此处可使用 window.carName 
      function myFunction() {
    carName = "Volvo";
}
    • 此处可调用 carName 变量 
      function myFunction() {
carName = "Volvo";
// 此处可调用 carName 变量
}
  • js中的转义
    \' 单引号\" 双引号\\ 反斜杠\n 换行\r回车\t tab(制表)\b 退格符\f换页符
  • 类型判断 
    function User(name , age){
this.name=name;
this.age=age;
}
var u=new User();
console.log( 'typeof u  :'+typeof u );  
//输出object  
//显然,使用typeof判断复杂类型的对象,就失效了,但使用constructor就可以获取其真实类型
console.log( 'u.constructor.name  :'+u.constructor.name );   //user
  • JS代码块的Break 
    cars=["BMW","Volvo","Saab","Ford"];
list:{
    document.write(cars[0] + "<br>"); 
    document.write(cars[1] + "<br>"); 
    document.write(cars[2] + "<br>"); 
    break list;
    document.write(cars[3] + "<br>"); 
    document.write(cars[4] + "<br>"); 
    document.write(cars[5] + "<br>"); 
}
    以上代码生成了名为list的代码块，并且break进行了跳出，同时continue 具有相同作用，不过只能应用于循环，而通过标签，break能够适用于任何js代码块
  • null和Undefined 区别： 
    typeof undefined             // undefined
typeof null                  // object
null === undefined           // false
null == undefined            // true
  • JS对象类型：
    • 在 JavaScript 中有 5 种不同的数据类型：
      string,number,boolean,object,function
    • 3 种对象类型：
      Object,Date,Array
    • 2 个不包含任何值的数据类型：
      null,undefined
    • 同时注意typeof方法中：
      NaN 的数据类型是 number
      数组(Array)的数据类型是 object
      日期(Date)的数据类型为 object
      null 的数据类型是 object
      未定义变量的数据类型为 undefined
  • JS的try catch throw 
    try{ 
    var x=document.getElementById("demo").value;
    if(x=="")    throw "值为空";
    if(isNaN(x))  throw "不是数字";
    if(x>10)     throw "太大";
    if(x<5)      throw "太小";
}
catch(err){
    var y=document.getElementById("mess");
    y.innerHTML="错误：" + err + "。";
}
  • JS的调试方法包括使用debugger，不过使用该方法需要打开浏览器调试工具
  • JS中如果String类型需要分行，要使用\ 
    var x = "Hello \
World!";
  • 程序块的作用域
    在每个代码块中 JavaScript 不会创建一个新的作用域，一般各个代码块的作用域都是全局的。以下代码的的变量 i 返回 10，而不是 undefined： 
    for (var i = 0; i < 10; i++) {
// some code
}
return i;
  • JS自调用函数
    以下是，最前最后加括号，还有一些类似的方法，但是这个可读性比较高 
    (function() {
    alert(1);
}());
  • JS没有强制要求参数数量和函数调用时的参数数量相同，即: 
    x = findMax(1, 123, 500, 115, 44, 88);
function findMax() {...}

并不会报错。同时JS提供了函数的内置对象arguments，根据这个可以得到相应的参数

  • this的调用 
    var myObject = {
    firstName:"John",
    lastName: "Doe",
    fullName: function () {
    return this.firstName + " " + this.lastName;
    }
}
myObject.fullName();         // 返回 "John Doe"
  • 使用构造函数调用函数 
    // 构造函数:
function myFunction(arg1, arg2) {
    this.firstName = arg1;
    this.lastName  = arg2;
}
// This creates a new object
var x = new myFunction("John","Doe");
x.firstName;         //John
  • JS的Browser对象
    location.hash 设置或返回从井号 (#) 开始的 URL（锚）
    location.host 设置或返回主机名和当前 URL 的端口号
    location.hostname 设置或返回当前 URL 的主机名
    location.href 设置或返回完整的 URL
    location.pathname 设置或返回当前 URL 的路径部分
    location.port 设置或返回当前 URL 的端口号
    location.protocol 设置或返回当前 URL 的协议
    location.search 设置或返回从问号 (?) 开始的 URL（查询部分）
    history.back() 与在浏览器点击后退按钮相同
    history.forward() 与在浏览器中点击按钮向前相同
  • JavaScript 计时事件
    setInterval("javascript function",milliseconds) - 间隔指定的毫秒数不停地执行指定的代码。
    setTimeout("javascript function",milliseconds) - 暂停指定的毫秒数后执行指定的代码
  • jQuery选择器
    • 如果已经是jQuery对象了了，则往下寻找的时候需要使用find()方法，如$("#phase_mx").find("input[name^='mFlt']")
    • jQuery的模糊匹配包括^=，$=，*=分别对应开始、结束、包含关系。
  • jQuery异步请求
    有三种方式 $.get，$.post，$.ajax，其中前两者是后者的简单方式，如果需要修改一些参数则要使用$.ajax， 
    $.ajax({
    url: "project/import",
    type: "POST",
    async: false,//同步或异步
    data: "test=test",//发送参数
    dataType: "json", //返回类型
    beforSend: function() {
    },
    success: function(msg) {
    },
    error: function() {
    }
})
  • jQuery获取文档内容
    jQuery中有text()和html()方法，和JS的innerTEXT()或innerHTML()类似，并且可以使用回调函数 
    $(selector).text(function(index,oldcontent))
  • 元素选择器
    利用jQuery选择器选取第几个元素时，不能直接用[]来选择，而是要通过eq来进行选择，如下： 
    for (var i = 0; i < $("input[type='text']").length; i++) {
    $("input[type='text'] :eq(" + i + ")").val(i);
}
    而在用dom节点选择的时候则可以利用[]来选择第几个元素，如： 
    document.getElementsByName('name')[0].value='changdy'
    JS和jQuery的不同一定要注意辨别
  • JS类型转换
    从input中得到的值默认是字符串类型的，如果期望是数字类型比较则有可能得到错误判断。这个时候需要用到类型转换，数字类型的可以使用parseFloat()和parseInt()方法。
    另外，JS中也有强制类型转换，比如Boolean(value)、Number(value)、String(value)。具体可以参考：cnblogs
  • jQuery each()方法
    each()方法中的this为dom对象，而不是jQuery对象，转换方法如$(this)，如果需要查找子对象则可以使用.find()方法
  • jQuery 发送文件
    当使用Spring MVC接收的时候，参数为@Param("fileName") MultipartFile file
  • 遍历Object对象 
    var obj = {a:1 , b:2 , c:3}
for(var s in obj){
  console.log(s);
  console.log(obj[s]);
}
  • JS中生成和解析JSON
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成，浏览时请结合常识与多方信息审慎甄别。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

相关阅读更多精彩内容

  • 前端基础面试题(JS部分)
    1.几种基本数据类型?复杂数据类型?值类型和引用数据类型?堆栈数据结构? 基本数据类型：Undefined、Nul...
    极乐君阅读 10,999评论 0赞 106
  • js高级
    第一章： JS简介 从当初简单的语言，变成了现在能够处理复杂计算和交互，拥有闭包、匿名函数， 甚至元编程等...
    LaBaby_阅读 5,623评论 0赞 6
  • js设计模式笔记
    单例模式 适用场景：可能会在场景中使用到对象，但只有一个实例，加载时并不主动创建，需要时才创建 最常见的单例模式，...
    Obeing阅读 6,490评论 1赞 10
  • Isotope进行筛选、排序、布局动画
    流式布局及动画 被itemSelector选中的元素以及被filter过滤出的元素都会获得流式布局及动画 筛选 排序
    李霖弢阅读 3,161评论 0赞 0
  • Haskell的软件事务内存(STM)
    传统的并发变成模型通过Mutex/Conditional Variable/Semaphore的设施来控制对共享资...
    驭风万里无垠阅读 4,421评论 0赞 0

友情链接更多精彩内容