|
So, I've spent most of my professional career working on system administration, databases, and desktop applications. Now I find myself being thrust into ASP.Net Web Api 2 to build REST interfaces so that an internet portal can access internal data via IIS.
I've got the server side down pretty good so my question is do I spend more time focusing on learning the ins and outs of JavaScript or TypeScript or both for the client side?
As a C# dev, the type safety and classes of TypeScript are appealing but it doesn't seem to support the breadth of ECMAScript capabilities like JavaScript does. I want to focus on what will work best but I don't want to bind my hands either. Since this is really my first serious foray into browser scripting, I wanted to get the opinion of the CPians that more experienced in such matters.
if (Object.DividedByZero == true) { Universe.Implode(); }
Meus ratio ex fortis machina. Simplicitatis de formae ac munus. -Foothill, 2016
|
|
|
|
|
TypeScript is the way to go. It would be more sensible coming from the C# dev background to have the structured code even in JavaScript world which is highly loose scripting language but with huge power.
|
|
|
|
|
Thanks. I thought that TypeScript would give me a little more piece of mind. Before getting started on that I'm reviewing this: ECMAScript Specifications[^]. I think that I need to build a strong foundation before attempting to build a house.
if (Object.DividedByZero == true) { Universe.Implode(); }
Meus ratio ex fortis machina. Simplicitatis de formae ac munus. -Foothill, 2016
|
|
|
|
|
I've never used TypeScript so I can't speak to that. I use jQuery a ton. It makes using JavaScript much easier.
There are two kinds of people in the world: those who can extrapolate from incomplete data.
There are only 10 types of people in the world, those who understand binary and those who don't.
|
|
|
|
|
My viewpoint is that these super-sets (TS, CS, DART, etc) compile to JavaScript. If JS itself were so tedious or difficult to work in I would understand that, but largely it doesn't make sense to me to add a link in a chain that already uses a high-level language. It's great for someone who doesn't have the interest or capacity to learn how the underlying technology works, but doesn't really benefit someone that's willing to dig in.
That said, the ECMA approach to OOP is pretty damn counter-intuitive to the C# mindset and there is a bit of a curve. I like that personally, because the switching of gears makes defining client-vs-server concerns fairly obvious, but I may be alone in that regard.
"There are three kinds of lies: lies, damned lies and statistics."
- Benjamin Disraeli
|
|
|
|
|
These are good points. The ECMA Standard and JavaScript is still the foundation of all the web scripting libraries so I see how working toward a professional level familiarity with it would be beneficial. It's similar to how Assembler is still the foundation of all of the programing languages. Does C# make programing a lot easier? Yes. Does is still end up as assembly instructions passed to the interpreter? Of course. C# and the rest of the high-level languages just make it easier to program, abstracting all the tedious bits. I may not be able to write a full program in x86 or x64 assembly (yet) but I know it works and that knowledge helps me write better code at the higher levels.
if (Object.DividedByZero == true) { Universe.Implode(); }
Meus ratio ex fortis machina. Simplicitatis de formae ac munus. -Foothill, 2016
|
|
|
|
|
Type script is a JavaScript inspired object oriented language that compiles to JavaScript.
At the end - in the browser - it is always JavaScript for now, so I would say: learn JavaScript inside-out...
After that, you may find it easier to use some intermediate - like TypeScript - to create the actual JavaScript code, but that's secondary...
If you are coming from the intermediate part only, you will find yourself helpless against a on-client-machine-only bug, that will force you to debug the JavaScript result (and generated code is always hard to read)...
Skipper: We'll fix it.
Alex: Fix it? How you gonna fix this?
Skipper: Grit, spit and a whole lotta duct tape.
|
|
|
|
|
I am beginning to believe that I will be better off just biting the bullet and learning more JavaScript. Any good resources to learn some of the intermidiate to advanced topics? I've got the internet (ecma-international.org, w3.org, w3schools.com) that have gotten me a good start as well as a book on JavaScript and JQuery. What I am looking for is a resource that tells me all the things I can do with JavaScript and a few pointers to get me started. So far, I'm learning how to manipulate the DOM and using XMLHttpRequest to do a little async processing from an MVC/WebApi test site that I built. Obviously, there's a lot you can do with it but nothing I can find paints a good road map on what subjects to focus on and in what order.
if (Object.DividedByZero == true) { Universe.Implode(); }
Meus ratio ex fortis machina. Simplicitatis de formae ac munus. -Foothill, 2016
|
|
|
|
|
|
Thanks. This should help a bit. Before I start relying on libraries I want to know how they work.
if (Object.DividedByZero == true) { Universe.Implode(); }
Meus ratio ex fortis machina. Simplicitatis de formae ac munus. -Foothill, 2016
|
|
|
|
|
The question is how deep a rabbit hole you are planning to follow. If your intention is to learn enough to do a project and will not become full time web developer, then TypeScript is probably easier. If you want to switch from being SysAdmin into a developer then I would suggest biting the bullet and get to know JS. I personally know JS then learn TS, then gone back to stick with JS. TS to JS is like C/C++ to Assembler.
|
|
|
|
|
|
i search a lot for example which i can run and see that angular service and factory is singleton in nature because i heard many time that these are singleton in nature when i read many write up on difference between service and factory but none one show this that these are singleton with example and code.
i am new in angular. so very curious to know how could i write a program which tell me that service and factory is singleton. if possible please provide a example.
sample service and factory
var myApp = angular.module('myApp', []);
myApp.service('helloWorldFromService', function() {
this.sayHello = function() {
return "Hello, World!";
};
});
myApp.factory('helloWorldFromFactory', function() {
return {
sayHello: function() {
return "Hello, World!";
}
};
});
thanks
|
|
|
|
|
A singleton object, would expose a public function through which you will access the internal instance of that type. It will hide all sort of constructors etc. from the outside world (either through private constructor or other means).
Thus, to test if this is the case, you can see the internal implementation, and try to access the type multiple times. If they are same, then it is singleton. Singleton doesn't prohibit the object from being called multiple times, or being attached to multiple types or services. The only thing to note here, is that the object must have only one instance.
Are Angularjs services singleton? - Stack Overflow
Services
You can read more in the link above, it states that the services are singleton, meaning all the objects and components get access to the reference of the single object instance on the runtime.
To know the details of how that gets implemented, you might want to study the code, or try to store different variables, attach components and then see where they are attached. In a singleton they will target the same parent.
The sh*t I complain about
It's like there ain't a cloud in the sky and it's raining out - Eminem
~! Firewall !~
|
|
|
|
|
thanks for your link. few days back i could simulate the same with a example which i like to share here.
i being able to create a small program which can tell me the factory is singleton. so here is the program code
<div ng-app="myApp">
<div ng-controller="FirstCtrl">
<br>Input is : {{data.firstName}}
<button ng-click="setData()">setData</button>
</div>
<hr>
<div ng-controller="SecondCtrl">
Input should also be here: {{data.firstName}}
<button ng-click="getData()">getData</button>
</div>
</div>
var myApp = angular.module('myApp', []);
myApp.factory('Data', function(){
var service = {
FirstName: '',
setFirstName: function(name) {
angular.copy(name, service.FirstName);
}
};
return service;
});
myApp.controller('FirstCtrl', function( $scope, Data ){
$scope.setData = function() {
Data.FirstName='Tridip';
};
});
myApp.controller('SecondCtrl', function( $scope, Data ){
$scope.FirstName = Data.FirstName;
$scope.getData = function() {
alert('get data '+Data.FirstName)
};
});
i being able to create a small program which can tell me the service is also singleton. so here is the program code
<div ng-app="myApp">
<div ng-controller="FirstCtrl">
<br>Input is : {{data.firstName}}
<button ng-click="setData()">setData</button>
</div>
<hr>
<div ng-controller="SecondCtrl">
Input should also be here: {{data.firstName}}
<button ng-click="getData()">getData</button>
</div>
</div>
var myApp = angular.module('myApp', []);
myApp.service('Data',function(){
var FirstName='';
this.setData=function(FirstName){
this.FirstName=FirstName;
};
this.getData=function(){
return FirstName;
};
});
myApp.controller('FirstCtrl', function( $scope, Data ){
$scope.setData = function() {
Data.setData('Mama');
};
});
myApp.controller('SecondCtrl', function( $scope, Data ){
$scope.getData = function() {
alert('get data '+Data.FirstName)
};
});
|
|
|
|
|
i am little bit familiar with angular. still on learning process. working with ng version 1.4.8. so i like to know how could i define constructor function in service and factory.
here is one sample service .now tell me how to define constructor in service or factory ?
angular.module('myApp').service('helloService',function($timeout){
this.sayHello=function(name){
$timeout(function(){
alert('Hello '+name);
},2000);
}
});
angular.module('myApp').controller('TestController',
function(helloService){
helloService.sayHello('AngularJS');
});
|
|
|
|
|
i am new in angular. so trying to know how to share data between two controller and search google. i visited few pages and found most of the time people use factory to share data. i just like to know can't we do it by service instead of factory ?
1st example
<div ng-controller="FirstCtrl">
<input type="text" ng-model="data.firstName">
<br>Input is : {{data.firstName}}
</div>
<hr>
<div ng-controller="SecondCtrl">
Input should also be here: {{data.firstName}}
</div>
myApp.factory('MyService', function(){
return {
data: {
firstName: '',
lastName: ''
},
update: function(first, last) {
this.data.firstName = first;
this.data.lastName = last;
}
};
});
myApp.controller('SecondCtrl', function($scope, MyService){
$scope.data = MyService.data;
$scope.updateData = function(first, last) {
MyService.update(first, last);
}
});
2nd example
var myApp = angular.module('myApp', []);
myApp.factory('Data', function(){
var service = {
FirstName: '',
setFirstName: function(name) {
angular.copy(name, service.FirstName);
}
};
return service;
});
myApp.controller('FirstCtrl', function( $scope, Data ){
});
myApp.controller('SecondCtrl', function( $scope, Data ){
$scope.FirstName = Data.FirstName;
});
examples are taken from this url https://stackoverflow.com/questions/21919962/share-data-between-angularjs-controllers
please guide me.
|
|
|
|
|
|
Hello! )) I try to write handler for buttons in JS through CSS-selectors. But i meet with difficulties.
in case of links this code JQuery works fine:
$(document).ready(function() {
var steps = $("form").children(".step");
$(steps[0]).show();
var current_step = 0;
$("a.next").click(function(){
if (current_step == steps.length-2) {
$(this).hide();
$("form input[type=submit]").show();
}
$("a.back").show();
current_step++;
changeStep(current_step);
});
$("a.back").click(function(){
if (current_step == 1) {
$(this).hide();
}
$("form input[type=submit]").hide();
$("a.next").show();
current_step--;
changeStep(current_step);
});
function changeStep(i) {
$(steps).hide();
$(steps[i]).show();
}
});
But i'd rather to prefer make this fuctionality for buttons - "Next" and "Back"
My HTML-code
<!DOCTYPE html>
<HTML xmlns="http://www.w3.org/1999/xhtml" >
<HEAD>
<META name="viewport" content="width=device-width charset=UTF-8" HTTP-EQUIV="Content-Type"/>
<LINK rel="stylesheet" href="templates.css" type="text/css"/>
<SCRIPT type="text/javascript" src="jquery-3.2.1.js"></SCRIPT>
<SCRIPT type="text/javascript" src="steps_registration.js"></SCRIPT>
<TITLE>Page</TITLE>
</HEAD>
<BODY>
<FORM method="get" action="send.php">
<DIV class="step">
<P class="step">step 1</P>
<P>Name:<INPUT type="text" name="login" placeholder="Login"></P>
</DIV>
<DIV class="step">
<P class="step">step 2</P>
<P>Sourname:<INPUT type="text" name="sname" placeholder="Input sourname"></P>
</DIV>
<DIV class="step">
<P class="step">step 3</P>
<P>E-mail:<INPUT type="text" name="mail" placeholder="Input e-mail"></P>
</DIV>
<P class="talign">
<INPUT type="button" onClick="history.back();" value="Back" name="1">
<INPUT type="button" onClick="history.forward();" value="Next" name="2">
<a href="#" class="back">Back</A>
<a href="#" class="next">Next</A>
<INPUT type="submit" value="OK">
</P>
</FORM>
</BODY>
</HTML>
My CSS
body {
margin:0;
}
form {
width:30%;
margin:0 auto;
}
form div.step {
display:none;
}
form div.step p.step{
text-align:center;
font-size:28px;
}
form div.step p{
}
form div.step p input{
float:right;
}
a.back {
display:none;
}
form input[type=submit] {
display:none;
}
a {
color:#006600;
text-decoration:none;
}
form p.talign{
text-align:center;
}
|
|
|
|
|
I do not understand what you are asking.
There are two kinds of people in the world: those who can extrapolate from incomplete data.
There are only 10 types of people in the world, those who understand binary and those who don't.
|
|
|
|
|
If you want to use button in place of link , then you have to use id of the button and use .click handler.
For instance, you have a button like this
<button id='btnNext'>Next</button>
then your click handler could be
$('#btnNext').click (.....
|
|
|
|
|
you want to use your input button in place of link , then you can use id of the input button and use .click handler.
Use HTML instance
<INPUT type="button" onClick="history.forward();" value="Next" name="2"> of this
<input type="button" id="btnNext" value="Next" name="2">
and Script
$("#btnNext").click(function () {
if (current_step == steps.length - 2) {
$(this).hide();
$("form input[type=submit]").show();
}
$("a.back").show();
current_step++;
changeStep(current_step);
});
do same as it is for another button
|
|
|
|
|
[DELETED]
-- modified 1-Jun-17 5:06am.
|
|
|
|
|
ArtCollector wrote: I must make sure that the OTP generation process is secure, "impossible" to bypass and free of any bugs or loopholes.
Do you think it's a really good idea to publish secure code on a public website and ask people to comment on problems?
You do realize that access to the source code makes hackers jobs a whole load easier?
I've deleted the link, and I'd strongly suggest that you delete it from the remote end as well before your IT security department notice it and rightly come down on you like a ton of bricks...
Bad command or file name. Bad, bad command! Sit! Stay! Staaaay...
AntiTwitter: @DalekDave is now a follower!
|
|
|
|
|
Did the code let you know which bank it was for? Need to know where never to put my money....
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
