javascrip基础学习

JS是一种解释性脚本语言,在网页开发用经常用到(HTML CSS),用于控制网页的行为。现在RTT的柿饼UI也是用JS来开发的,所以很有必要学习一下。

注释:// 、/*  */

语句分行;

折行\

大小写敏感。

<scrip>  .... </scrip>

关键词和语句:

try ..catch..throw

var:定义一个变量

function:定义一个函数;函数表达式:当用一个变量接收函数返回值后,该变量可以做为函数指针使用;箭头函数不能用函数提升而应先定义后使用。自动以函数:形式上就是将整个函数作为函数指针。

    函数可以设置默认参数,函数有个内置的对象 arguments 对象:arguments[i]或者arguments.length;

    函数不属于任何对象,默认是全局的,在HTML中属于HTML页面,而在浏览器中属于Window.

    函数中可以用this指针来操作;

    函数可以内嵌函数。 

              对象的方法:对象内的的K-V的V如果是函数的返回值则成为函数的方法,里面可以用this指针,根据是否是strict模式,this指向undefinedwindow,可以用obj.k()或者fun.apply(obj,[参数数组])或者fun.call(obj,参数顺序列表) 来调用。

         装饰器:动态的改变函数行为; 

               高阶函数:就是函数的参数可以是函数,即一个函数可以接收另一个函数作为参数。最典型的函数有:

  • arry.map(fun)/arry.reduce(fun):前者是将一个数组通过一个函数映射后得到一个新的数组;后者是一个数组的n个参数通过某个函数得到某个结果,将该结果作为一参数添加n-1个元素进行f运算,多次迭代直到结束。
  • arry.filter(function {})把传入的函数依次作用于每个元素,然后根据返回值是true还是false决定保留还是丢弃该元素,将结果作为一个新数组。回调 函数的三元素element, index, self
  • sort():也是一个高阶函数,通过比较大小调整原数组的位置,即原数组也发生了改变。
  • every()方法可以判断数组的所有元素是否满足测试条件
  • find()方法用于查找符合条件的第一个元素,如果找到了,返回这个元素,否则,返回undefined;findIndex()find()类似,也是查找符合条件的第一个元素,不同之处在于findIndex()会返回这个元素的索引,如果没有找到,返回-1
  • forEach()常用于遍历数组,但不会返回新的数组;

箭头函数:相当于匿名函数和lamda函数,省去了{}和返回值,箭头函数中的this指针指向本对象

生成器generator看上去像一个函数,但可以返回多次,能记住状态相当于一个C中一个static修饰的局部变量或者全局变量。

闭包:返回一个函数并延迟执行,借助闭包,同样可以封装一个私有变量

     

              

数据类型:数字、字符串、布尔、数组、对象(两种寻址方法,对象是键值对的容器。类似python中的字典或C总的哈希表,对象的属性就是一些键值对,对象的方法作为函数定义在函数的属性中),对象的K如果是有效变量名则可用object.prop访问,如为特殊字符则需要用``,且访问用object【··】来访问;判断是否是对象属性可以用v in obj或者用obj.hasOwnProperty('prop')来判断;对象的添加和删除object.newprop=''; / delelt object.newpro

var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566,
    fullName : function()
    {
       return this.firstName + " " + this.lastName;
    }
};

在函数内部没有用Var定义的变量为全局变量。new出来的用typeof出来的是object.

字符串有属性和方法。

Var/let/const关于变量作用域及变量提升

JSON:更多 JSON 信息,你可以阅读我们的 JSON 教程

英文全称 JavaScript Object Notation,用于存储和数据交换(服务器到浏览器传输)的格式。JSON 字符串转换为 JavaScript 对象:

 /*首先,创建 JavaScript 字符串,字符串为 JSON 格式的数据:*/

var text = '{ "sites" : [' + '{ "name":"Runoob" , "url":"www.runoob.com" },' + '{ "name":"Google" , "url":"www.google.com" },' + '{ "name":"Taobao" , "url":"www.taobao.com" } ]}';

obj = JSON.parse(text);//然后,使用 JavaScript 内置函数 JSON.parse() 将字符串转换为 JavaScript 对象

/*最后,在你的页面中使用新的 JavaScript 对象*/

document.getElementById("demo").innerHTML = obj.sites[1].name + " " + obj.sites[1].url;

 

HTML 载入外部 JavaScript 文件

使用简洁的格式载入 JavaScript 文件 ( type 属性不是必须的):

<script src="myscript.js">

JavaScript 正则表达式:

语法:/正则表达式主体/修饰符(可选)

用途:在 JavaScript 中,正则表达式通常用于两个字符串方法 : search() 和 replace(),用于文本和字符串的搜索和替换。

类似的方法有:/e/.test()或者/e/.exec()

完整的 RegExp 对象参考手册,请参考我们的 JavaScript RegExp 参考手册

 

 

网页内容:

"<br>"表示换行。

基础语法:

 1 逻辑判断用===而不用==后者先将两边转换同种类型再比较,有时候结果很诡异;JavaScript把nullundefined0NaN和空字符串''视为false,其他值一概视为true;

  循环除了和C语言一样外还有变体for ...in ...

2 是否不是数字的判断方法:isNaN(NaN);0是一个数值;‘’是一个空字符串;null表示为空的值;infinite(比如除数是0的结果);undefined(比如数组越界)

3浮点数比较:只能计算它们之差的绝对值,看是否小于某个阈值:Math.abs(1 / 3 - (1 - 2 / 3)) < 0.0000001; // true

4 JavaScript的同一个数组中可以包括任意数据类型,创建新数组:new Array(1, 2, 3); // 创建了数组[1, 2, 3];数组长度:'.lenth',给该属性赋值可以动态改变数组长度,数组可以嵌套组成多维数组;常用属性方法:

indexOf(index)/slice即截取或拷贝新数组,不包含结束;

push和pop在数组的末尾动态的添加和删除元素;

unshift和shift数组的头部添加若干和删除首个元素;

sort排序;

reverse反转

splice(2, 3, 'Google', 'Facebook')从指定位置开始删除多个个,并从该位置开始添加若干个;

concat拼接返回一个新的数组;

join用指定的字符链接;

5对象:用var定义(的变量的作用域为函数体内)的无序K-V对组合,k的值为字符串(最新的ES6规范引入了新的数据类型Map/Set此时K可以为数字),不用var定义的变量默认为全局变量。当用strict模式('use strict';声明)后不用var定义将报错

  

var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]);m.get('Michael'); // 95
var m = new Map(); // 空Map
m.set('Adam', 67); // 添加新的key-value
m.set('Bob', 59);
m.has('Adam'); // 是否存在key 'Adam': true
m.get('Adam'); // 67
m.delete('Adam'); // 删除key 'Adam'
m.get('Adam'); // undefined
 

5控制台输出:console.log()代替alert()的好处是可以避免弹出烦人的对话框。

7字符串:用''""括起来的字符,多行字符串用反引号(和键盘上的~同一个键);ASCII字符可以以\x##形式的十六进制表示;用\u####表示一个Unicode字符;字符串的连接用+或者模板字符串${变量};

 对字符串中字符的索引可用类似数组的下标索引,但对其赋值无效;字符串操作 常用方法toUpperCase、toLowerCase、indexOf、substring(start,stop)、

 8iterable类型遍历Array可以采用下标循环,遍历MapSet就无法使用下标。为了统一集合类型,ES6标准引入了新的iterable类型,ArrayMapSet都属于iterable类型。具有iterable类型的集合可以通过新的for ... of循环来遍历,forEach方法。

 9 函数:用关键字fun  fun_name(参数)。注意:JavaScript函数允许接收任意个参数,可以用argument来接收所有参数,arguments.lenth表示长度;用 ...rest来表示变参和拾取变化的所有参数到一个数组中;jJavaScript引擎有一个在行末自动添加分号的机制

  所以当return 要么加{}要么写在一行上。

       函数可以嵌套;内层可以调用外层同名变量,反之不可;

      JavaScript引擎自动提升了变量的声明,但不会提升变量的赋值,所以先调用后定义不会语法出错但逻辑会不如预期。全局变量是在windows对象下,不同的JavaScript文件如果使用了相同的全局变量,或者定义了相同名字的顶层函数,都会造成命名冲突,并且很难被发现,此时可以用命名空间如下;局部作用域:用let代替var,定义的变量作用域为从定义的{}内。

// 唯一的全局变量MYAPP:
var MYAPP = {};
// 其他变量:
MYAPP.name = 'myapp';
MYAPP.version = 1.0;
// 其他函数:
MYAPP.foo = function () {
    return 'foo';
};
常量定义:const 大写变量=value;
析构赋值(可嵌套,可省略,可指定默认值,ES6版本支持Chrome,Firefox,Edge):
var [x, y, z] = ['hello', 'JavaScript', 'ES6'];

 

posted on 2019-02-27 23:46  杰瑞鼠  阅读(224)  评论(0编辑  收藏  举报