自学JS
通过慕课网自学JS,敲了好多代码,好像没什么卵用,附上代码,再接再厉吧!
//属性getter setter方法
var man = {name : 'wsy',
weibo : '@wsy',
get age(){return new Date().getFullYear()-1996;},
set age(val){console.log('Age can\'t be set to' +val);}
}
var man = {
weibo : '@wsy',
$age : null,
get age(){
if(this.$age == undefined){
return new Date().getFullYear()-1996;
}else{
return this.$age;
}
},
set age(val){
val = +val;
if(!isNaN(val)&&val >0 && val < 150){
this.$age = +val;
}else{
throw new Error('Incorrect val =' +val);
}
}
}
//属性标签及操作
function foo(){}
Object.defineProperty(foo.prototype,'z',{get : function(){return 1;}});
var obj = new foo();
Object.defineProperty(obj,'z',{value : 100,configurable : true});
var o = {};
Object.defineProperty(o , 'x' , {value : 1});
var obj = Object.create(o);
Object.defineProperty(obj , 'x' ,{writable : true , configurable : true , value : 100});
Object.getOwnPropertyDescriptor({pro : true} , 'pro');
Object.getOwnPropertyDescriptor({pro : true} , 'a');
var person = {};
Object.defineProperty(person , 'name' , {
configurable : false,
writable : false,
enumerable : false,
value : "wsy"
});
Object.defineProperty(person , 'type' , {
configurable : true,
writable : true,
enumerable : false,
value : "Object"
});
Object.defineProperties(person , {
title : {value : 'fe' , enumerable : true},
corp : {value : 'BABA' , enumerable : true},
salary : {value : 50000 , enumerable : true , writable : true}
});
Object.getOwnPropertyDescriptor(person , 'salary');
Object.getOwnPropertyDescriptor(person , 'corp');
Object.defineProperties(person , {
title : {value : 'fe' , enumerable : true},
corp : {value : 'BABA' , enumerable : true},
salary : {value : 50000 , enumerable : true , writable : true},
luck : {
get : function(){
return Math.random() > 0.5 ? 'good':'bad';
}
},
promote : {
set : function(level){
this.salary *= 1 + level * 0.1;
}
}
});
//对象标签 [[extensible]]
var obj = {x : 1 , y : 2};
Object.isExtensible(obj);
Object.preventExtensions(obj);
Object.isExtensible(obj);
obj.z = 1;
obj.z;
Object.getOwnPropertyDescriptor(obj , 'x');
Object.seal(obj);
Object.getOwnPropertyDescriptor(obj , 'x');
Object.isSealed(obj);
Object.freeze(obj);
Object.getOwnPropertyDescriptor(obj , 'x');
Object.isFrozen(obj);
//序列化
var obj = {x : 1 , y : true , z : [1,2,3] , nullVal : null};
JSON.stringify(obj);
obj = {val : undefined , a : NaN , b : Infinity, c : new Date()};
JSON.stringify(obj);
obj = JSON.parse('{"x" : 1}');
obj.x;
//序列化-自定义
var obj = {
x : 1,
y : 2,
o : {
o1 : 1,
o2 : 2,
toJSON : function(){
return this.o1 + this.o2;
}
}
};
JSON.stringify(obj);
//其它对象方法
var obj = {x : 1 , y : 2};
obj.toString();
obj.toString = function(){return this.x + this.y};
"Result" + obj;
+obj;
obj.valueOf = function(){return this.x + this.y + 100};
+obj;
"Result" + obj;
//数组操作
var arr = [];
arr[0] = 1;
arr[1] = 2;
arr.push(3);
arr;
arr[2] = undefined;
2 in arr;//true
delete arr[2];
2 in arr;//false
//遍历二维数组
var arr = [[1,2],[3,4],[5,6]];
var i = 0;
var row;
for(; i<arr.length;i++){
row = arr[i];
console.log('row' +i);
for(j = 0; j<row.length;j++){
console.log(row[j]);
}
}
//数组方法
//join
var arr = [1,2,3];
arr.join();
arr.join("_");
function repeatString(str , n){
return new Array(n+1).join(str);
}
repeatString("a" , 3);
repeatString("Hi" , 5);
//reverse
var arr = [1,2,3];
arr.reverse();
arr;
//sort
var arr = ["a","d","b","c"];
arr.sort();
arr = [13,24,3,44,5];
arr.sort();
arr;
arr.sort(function(a , b){
return a - b;
})
arr = [{age : 25},{age : 39},{age : 99}];
arr.sort(function(a , b){
return a.age - b.age;
})
arr.forEach(function(item){
console.log('age' , item.age);
})
//concat
var arr = [1,2,3];
arr.concat(4,5);
arr;
arr.concat([10,11],13);
arr.concat([1,[2,3]]);
//slice
var arr = [1,2,3,4,5];
arr.slice(1,3);
arr.slice(1);
arr.slice(1 , -1);
arr.slice(-4 , -3);
//splice
var arr = [1,2,3,4,5];
arr.splice(2);
arr;
arr = [1,2,3,4,5];
arr.splice(2,2);
arr;
arr = [1,2,3,4,5];
arr.splice(1,1,'a','b');
arr;
//forEach
var arr = [1,2,6,4,5];
arr.forEach(function(x , index , a){
console.log(x + '|' + index + '|' + (a === arr));
});
//map
var arr = [1,2,3];
arr.map(function(x){
return x + 10;
})
arr;
//filter
var arr = [1,2,3,4,5,6,7,8,9,10];
arr.filter(function(x,index){
return index%3 ===0||x >=8;
});
arr;
//every&some
var arr = [1,2,3,4,5];
arr.every(function(x){
return x <10;
});
arr.every(function(x){
return x <3;
});
var arr = [1,2,3,4,5];
arr.some(function(x){
return x === 10;
});
arr.some(function(x){
return x === 3;
});
//reduce&reduceRight
var arr = [1,2,3];
var sum = arr.reduce(function(x,y){
return x + y;
},0);
arr;
arr = [3,9,6];
var max = arr.reduce(function(x , y){
console.log(x + "|" +y);
return x > y ? x : y;
});
max;
arr = [3,9,6];
var max = arr.reduceRight(function(x , y){
console.log(x + "|" +y);
return x > y ? x : y;
});
max;
//IndexOf&lastIndexOf
var arr = [1,2,3,2,1];
arr.indexOf(2);
arr.indexOf(99);
arr.indexOf(1,1);
arr.indexOf(2,-1);
arr.lastIndexOf(2);
arr.lastIndexOf(2,2);
arr.lastIndexOf(2,-3);
//Array.isArray
Array.isArray([]);
[] instanceof Array;
({}).toString.apply([]) === '[object Array]';
//变量&函数的声明前置
var num = add(1,2);
console.log(num);
function add(a , b){
a = + a;
b = + b;
if(isNaN(a) || isNaN(b)){
return;
}
return a + b;
}
var num = add(1,2);
console.log(num);
var add = function(a , b){
a = + a;
b = + b;
if(isNaN(a) || isNaN(b)){
return;
}
return a + b;
}
//命名函数表的式(NFE)
var func = function nfe(){};
alert(func === nfe);//Uncaught ReferenceError: nfe is not defined at <anonymous>:2:16
//Function构造器
var func = new Function('a' , 'b' , 'console.log(a + b);');
func(1 , 2);
var func = Function('a' , 'b' , 'console.log(a + b);');
func(1 , 2);
Function('var localVal = "local"; console.log(localVal);')();
console.log(typeof localVal);
var globalVal = 'global';
(function(){
var localVal = 'local';
Function('console.log(typeof localVal , typeof globalVal);')();
})();
//全局的this(浏览器)
console.log(this.document === document);
console.log(this === window);
this.a = 37;
console.log(window.a);
//一般函数的this(浏览器)
function f1(){
return this;
}
f1() === window;
function f2(){
"use strict";
return this;
}
f2() === undefined;
//作为对象方法的函数的this
var o = {
prop : 37,
f : function(){
return this.prop;
}
};
console.log(o.f());
var o = {prop : 36};
function independent(){
return this.prop;
}
o.f = independent;
console.log(o.f());
//对象原型链上的this
var o = {f:function(){return this.a + this.b;}};
var p = Object.create(o);
p.a = 1;
p.b = 4;
console.log(p.f());
//get/set方法与this
function modulus(){
return Math.sqrt(this.re * this.re + this.im * this.im);
}
var o = {
re : 1,
im : -1,
get phase(){
return Math.atan2(this.im , this.re);
}
};
Object.defineProperty(o , 'modulus' , {
get : modulus , enumerable:true , configurable:true
});
console.log(o.phase , o.modulus);
//构造器中的this
function MyClass(){
this.a = 37;
}
var o = new MyClass();
console.log(o.a);
function C2(){
this.a = 37;
return {a : 38};
}
o = new C2();
console.log(o.a);
//call/apply方法与this
function add(c , d){
return this.a + this.b + c + d;
}
var o = {a : 1 , b : 3};
add.call(o , 4 ,5);
add.apply(o , [10 , 20]);
function bar(){
console.log(Object.prototype.toString.call(this));
}
bar.call(7);
//bind方法与this
function f(){
return this.a;
}
var g = f.bind({a : "test"});
console.log(g());
var o = {a : 37 , f : f , g : g};
console.log(o.f(),o.g());
自学JS的更多相关文章
- 黄金点游戏(js+css)
一.项目描述:黄金点游戏 黄金点游戏是一个数字小游戏,其游戏规则是: N个同学(N通常大于10),每人写一个0-100之间的有理数 (不包括0或100),交给裁判,裁判算出所有数字的平均值,然后乘以0 ...
- 使用CSS3+jquery.js 实现微信抽奖转盘效果
上次发表了一篇 微信抽奖转盘活动-效果源码分析 最近想起了刚接到这个项目时第一时间脑海里迸出的解决方法 “CSS3”! 为什么不能用CSS3来实现呢? 所以我打算用CSS3来实现这个效果.并不需要依赖 ...
- JS 实现无缝滚动动画原理(初学者入)
这段时间在教培训班的学生使用原生javascript实现无缝滚动的动画案例,做了这个原理演示的动画,分享给自学JS的朋友!博主希望对你们有帮助! 在讲解之前先看一下demo: demo:https:/ ...
- eclipse解决js提示
自学js,发现eclipse中不管js文件.html文件.jsp文件没有都没js代码的提示,对于js代码也不报错,有时候就因为单词敲错却查了很久没查出来,很烦很难受. 在网上找了很多方法,都没有解决, ...
- 【Alpha版本】冲刺阶段——Day 8
我说的都队 031402304 陈燊 031402342 许玲玲 031402337 胡心颖 03140241 王婷婷 031402203 陈齐民 031402209 黄伟炜 031402233 郑扬 ...
- NodeJS写模块和引入模块的例子
nodejs自学.js function hello(){ console.log("hello world");} function s(){ console.log(" ...
- 前端自学路线之js篇
上一篇我们讲了前端切图的学习路线,不知大家有没有收获.今天来聊聊前端工程师的核心技能之——JavaScript.js这门语言看似简单,但要做到入门.熟练以至于架构的程度,还是有一段路要走的,今天就来聊 ...
- JS自学笔记05
JS自学笔记05 1.例题 产生随机的16进制颜色 function getColor(){ var str="#"; var arr=["0","1 ...
- JS自学笔记04
JS自学笔记04 arguments[索引] 实参的值 1.对象 1)创建对象 ①调用系统的构造函数创建对象 var obj=new Object(); //添加属性.对象.名字=值; obj.nam ...
随机推荐
- 让Xcode日志输出中文
有的时候xcode打印后台返回的日志,明明后台返回的是中文,但是在xcode的日志里面却不是中文,而是unicode编码,这个就比较坑,因为看不到内容. 其实解决办法有两种: 第一种就是给xcode安 ...
- unity传送门类似效果实现
简述 在传送门中,核心的玩法是在地上或者墙上打开2个可以联通的洞来实现传送的效果.以此扩展加入解谜要素构成游戏的核心. 这里尝试使用unity来实现传送门的核心功能,具体功能分析如下: 1.传送门的模 ...
- Oracle DQL查询语言整理
select * from t_hq_ryxx; select nianl, xingm from t_hq_ryxx; select nianl as 年龄, xingm as 姓名 from t_ ...
- python+robot framework实现测报告定制化和邮件发送
前面已经介绍了python+robot framework自动化框架和基本原理的实现,详情请看 python+robot framework接口自动化测试 本章主要讲解报告已经产生那如何以自动化的方式 ...
- Myeclipse快捷键以及使用技巧大全-来自网络
1. 打开MyEclipse 6.0.1,然后"window"→"Preferences" 2. 选择"java",展开,"Edi ...
- 对象的创建过程(chapter5.7.3)
总结一下对象的创建过程,假设有一个名为Dog的类: 1. 即使没有显示地使用static关键字,构造器实际上也是静态的方法,因此,当首次创建类型为Dog的对象时(构造器可以看成静态方法),或者Dog类 ...
- JSON的数据类型
数据类型简介 在计算机中,我们需要知道正在处理什么类型的数据,因为不同类型的数据有着不同的操作途径.可以让两个阿拉伯数字相乘,但是不能让两个单词相乘. 在计算机科学中,有一种数据类型被称为原始数据类型 ...
- 写出稳定的Modbus代码之点滴经验
1.引言 Modbus是工业领域重要的协议,物理层有常见的RS485双绞线和TCP,所以又常说Modbus 485开发和Modbus TCP开发. 前者就是串口通信,比较简单.后者涉及到网络协议,复杂 ...
- less学习笔记(二)
1.作用域:基本与javascrip的作用域相似,即先找局部变量,后找全局变量.找变量时遵循就近原则. 2.条件表达式:.mixin (@a) when (lightness(@a) >= 50 ...
- 使用react native制作的一款网络音乐播放器
使用react native制作的一款网络音乐播放器 基于第三方库 react-native-video设计"react-native-video": "^1.0.0&q ...