您的位置: 首页  >  IT文章  >  javascript权威指南学习笔记 1、概述 2、语法结构   1、javascript区分大小写。 3、类型、值和变量

javascript权威指南学习笔记 1、概述 2、语法结构   1、javascript区分大小写。 3、类型、值和变量

分类: IT文章 • 2022-08-01 11:54:26

 目录

1、概述

 第一部分：javascript语言核心

2、语法结构

3、类型、值和变量

1、javascript、html、css是前端开发的三项基本技能，要一一学习。

2、javascript是一门怎样的语言？

    1）javascript是一门动态的、弱类型的、基于原型的、直译式的语言（理解动态和弱类型），适合面向对象和函数式编程方格的语言。

   2） 欧洲计算机制造商协会（ECMA）在ECMA-262文档中定义了一种脚本语句规范，它叫ECMAScript。而javascript、jscript、ActionScript、ScriptEase是对ECMAScript的一种实现。实际上JavaScript是由ECMAScript，DOM（文档对象模型）和BOM（浏览器对象模型）三者组成的

   3）

  1. ECMAScript，描述了该语言的语法和基本对象。
  2. 文档对象模型（DOM），描述处理网页内容的方法和接口。
  3. 浏览器对象模型（BOM），描述与浏览器进行交互的方法和接口。

    4）直译式和编译式语言

        直译：从可读源程序解释执行，效率低，可移植性强。直译式 = 解释执行，直接由应用程序解释程序语法来控制执行
        编译：编译程序直接输出可执行文件，效率高，可移植性弱。编译式 = 编译执行，编译成操作系统可识别的应用程序由操作系统执行
        混合：编译程序输出中间代码，由支撑环境解释中间代码执行，效率较高，可移植性不错

    4）各章核心内容。

    学玩后再来写

2、语法结构

 

1、javascript区分大小写。

2、可选的分号：一句后面要养成以分号结束的习惯，虽然不以分号结束而将每一句语句当成一行写可能不会出问题，但如果一句语句里不能被解释成一句有效的执行语句时会将下一句一起并在前一句解析，直到能成为一句可执行的语句。这样就可能出错。

var a
a
=
3
console.log(a)
解析成：var a;a=3;console.log(a)

var y=x+f
(a+b).toString()
解析成：var y=x+f(a+b).toString();

3、类型、值和变量

1、对象的值是持久性的。 

1  var a=3;var b=a;a=a+1; 
2  alert(b);///此时的b=4

2、运算符

  •    ===  恒等
  • &&

          &&运算符的用法：1、返回true或是false的布尔类型。2、具有“短路行为”。如下：

var a={x:'abc',y:2};
var b=null;
a&&a.x&&a.x.length///返回3
b.x//如果单独这样就报错
b&&b.x///这样就不会报错了，返回null，&&的短路行为一般是用来确保最右边的表达式不出错

3、类型、值和变量

    3.1包装对象

   

var a='abc';
a.len=3;
var b=a.len;///b为undefined。b为包装对象
var c=a.length;//c为3，a.length调用了String类型的属性。

 3.2、不可变的原始值和可变的对象引用

     原始值（undefined,null,数字,字符串）的比较是值的比较，值相等就相等；

    对象（包括数组，函数）的比较非值的比较；对象是“引用类型”区别于“基本类型”，两个单独的对象永远不相等

var ob_a1={x:1};
var ob_a2={x:1};
var ob_a3=ob_a1;///引用
var int_a1=1;
var int_a2=1;
var int_a3=int_a1
ob_a1===ob_a2;//false
ob_a1===ob_a2;//false
ob_a1===ob_a3;///true
ob_a3.x=2;//修改了ob_a1.x的值为2
int_a1===int_a2;///true;不可变的原始值比较
int_a1===int_a3;///true
///对象的比较永远不相等

 3.3、类型转换

 4、对象   

     对象包括内置对象如：Object,String,Date等和宿主对象如：window

    4.1、创建对象

           直接量创建对象：var a={x:1,y:2}

          用new创建对象：var a=new Date();

          用Object.create(): var a=Object.create({x:1,y:2})//创建一个继承了x和y属性的对象

    4.2、原型prototype

         

var a={
  ts:function(){alert('ts')}
}
var b=new Object();//建空对象
b.prototy=a;//对象的原型为a，即继承了a
b.ts();//会输出ts

4.3、对象的属性

     三种属性：原型属性（prototype),class属性,可扩展属性

     调用方式两种：object.property或object['property']。使用第二种方式可以动态的访问object的属性，因为'property'是可以计算出值的。

     删除属性：delete object.property或delete object['property']

     检测属性：

//检测属性方法：in
//hasOwnProperty()，检测给定的名字是否是对象的自有属性
var a={x:'abc',y:2};
var b={x:undefined}
'x' in a;//true:'x'是a的属性
'toString' in a;//true,a继承toString属性
a.toString();//输出[object Object]
a.hasOwnProperty("x");//true
a.hasOwnProperty('toString');//false,是继承属性，不是自有属性
a.x!==undefined//true,证明x是a的属性，反之就不是
b.x!==undefined//false,但x是b的属性，在这里只能用in方法来检测

 枚举属性：

用for/in遍历对象中所有可枚举的属性（包括自有属性和继承属性），把属性名称赋值给变量，对象继承的内置方法不可枚举： 

var a={x:'abc',y:2};///两个可枚举自有属性
a.propertyIsEnumerable('toString');//false,不可枚举
for(p in a){alert(p)}//输出x,y,不会输出toString

数据属性(data property)和存取属性(accessor property)

var a={
       $x:1,///$符号暗示这个属性是一个私有属性，这是数据属性
       get next(){///next是存取属性，这是get
         return this.$x++;
       },
       set next(n){///这是set
         this.$x=n;
       }
      };
a.next;
a.$x;///x为2
a.next=3;
a.$x;///x为3

4.4、继承

     

var a={x:1,y:2};
var b=Object.create(a);///用create方法创建对象
var c=new Object();c.propotype=a;//用另外一种方法创建对象
b.x;//b.x=1
a.x=10;///对原型属性的修改也会改变继承自他的对象的值
b.x;///b.x=10
c.x;///c.x=undefined
c.x=11;
a.x///a.x=10
b.x=11;
a.x;///a.x=10，对b.x改变后，没有影响原型a的x属性的值

 4.5、序列化对象

var o={
  x:1,
  y:2,
  fun:function(){
    alert(1);
  }
}
JSON.stringify(o)///输出字符串{"x":1,"y":2}，fun函数不可化

5、数组

    数组的元素可以是不一样的类型如果['abc',1,[1,2],{x:1,y:2}]

   数组值的最后允许逗号，所以[,,]有2个元素，都是undefined

 创建数组的三种方法

var a=[,,3,];//a.length=3，直接量创建数据允许以逗号结尾
var b=new Array(10);
//var c=new Array(,,3,);//这种定义出错,只有直接量能用这种方法
var d=new Array(1,[],{});//

数组的增加和删除

var a=[];
a.push(1,2,[],{});//长度为4
delete a[3];//删除数组元素不会影响数组长度
a.length;///长度为4

多维数组array[n1]...[nn] 

数据的方法：

///join、reverse(反排序)、sort(排序,改变了原始值)、
//concat(返回一个包含原数组和函数里面参数的新数组)
///slice(a,b)返回第a个和第b个的值，如果a,b是负数，就是倒数
///splice(a,b,c)方法第一个参数指定起始位置，第二个参数指定要删除的个数，如果没有就删除到
///尾，第三个参数是要插入到起始a位置的参数，函数返回删除的值，原始值会被改变
///push和pop,unshift和shift  push和pop在尾部加或减，unshift和shift在尾部加或减
var a=[1,2,['a','b'],{x:1,y:2}]
a.join('-')//输出1-2-a,b-[object Object]
a.reverse().join('')//输出[object Object]a,b21
a.sort().join('')//输出12[object Object]a,b
var b=['aa','Bb','cc','Dd'];
///在sort里加函数，可以自定义排序的规则
b.sort(function(a,b){
  var x=a.toLowerCase();
  var y=b.toLowerCase();
  if (x>y) return -1;//返回小于零的，a排前
  if(x<y) return 1;//返回大于零的，a排后
  return 0;
}).join('--')///输出Dd--cc--Bb--aa
///concat、slice用法
b.concat(0,[1,2,[3,4],['x','y']]).join('@')//返回Dd@cc@Bb@aa@0@1@2@3,4@x,y
b.slice(1,-1).join()//返回cc,Bb
///splice用法
var c=[1,2,3,4,5,6,7,8,9];
c.splice(5);//返回[6,7,8,9],c=[1,2,3,4,5]
c.splice(2,2)//返回[3,4],c=[1,2,5]
c.splice(2,0,'a','b');//返回[],a=[1,2,a,b,5]
c.splice(2,2,[1,2],{x:1,y:2},'abc');///返回[a,b],c=[1,2,1,2,[object Object],abc,5]

///push和pop在尾部加或减，unshift和shift在尾部加或减
var stack=[];
stack.push('a','b',1,2);///stack：[a,b,1,2],返回4
stack.pop();//stack:[a,b,1],返回2
stack.shift();//stack:[b,1],返回a
stack.unshift({x:1})//stack:[[object Object],b,1],返回3

//toString()和toLocaleString()
stack.toString();//返回[object Object],b,1
stack.toLocaleString();//返回和上面一样的本地化的字符串

 ecmascript 5中的数组方法 

/*
ECMAScript5中的数组方法
forEach,map,filter,every,some,reduce和reduceRight,indexOf和lastIndexOf
*/
//forEach，遍历数组
var a=[1,2,3,4,5]
a.forEach(function(value,index,obj){///分别是遍历的值,索引值,对象本身，也可以只用value一个参数
  a[index]=value+10;
})//a=[11,12,13,14,15]

///map函数，将数据的每个元素传递给指定函数，并返回一个数组，它包含该函数的返回值
b=a.map(function(val){
  return val*val;
})///b=[121,144,169,196,225]

//filter函数，返回调用此函数的数组的一个子集。将数组的元素传给函数，
//函数如果返回true，这个元素就是子集中的一员
c=a.filter(function(value){
  return value%2==1;
})//返回奇数[11,13,15]

///every()和some(),返回一个布尔类型，将数组元素传给函数，函数返回布尔值
///every对所以布尔值进行“并”操作，some进行“或”操作，返回操作后的结果值
a.every(function(value){
  return value%2==1
})///返回false，数据里并不是所以值都为奇数
a.some(function(value){
  return value%2==1
})///返回true，数据里存在值为奇数的数


/*
true
*/

6、函数

相关推荐